@vendure/admin-ui 3.4.3-master-202509260228 → 3.5.0-minor-202510012036
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/core/common/generated-types.d.ts +92 -30
- package/core/common/version.d.ts +1 -1
- package/fesm2022/vendure-admin-ui-catalog.mjs +109 -109
- package/fesm2022/vendure-admin-ui-catalog.mjs.map +1 -1
- package/fesm2022/vendure-admin-ui-core.mjs +915 -1000
- package/fesm2022/vendure-admin-ui-core.mjs.map +1 -1
- package/fesm2022/vendure-admin-ui-customer.mjs +43 -43
- package/fesm2022/vendure-admin-ui-customer.mjs.map +1 -1
- package/fesm2022/vendure-admin-ui-dashboard.mjs +41 -41
- package/fesm2022/vendure-admin-ui-dashboard.mjs.map +1 -1
- package/fesm2022/vendure-admin-ui-login.mjs +10 -10
- package/fesm2022/vendure-admin-ui-login.mjs.map +1 -1
- package/fesm2022/vendure-admin-ui-marketing.mjs +10 -10
- package/fesm2022/vendure-admin-ui-marketing.mjs.map +1 -1
- package/fesm2022/vendure-admin-ui-order.mjs +133 -133
- package/fesm2022/vendure-admin-ui-order.mjs.map +1 -1
- package/fesm2022/vendure-admin-ui-react.mjs +15 -15
- package/fesm2022/vendure-admin-ui-react.mjs.map +1 -1
- package/fesm2022/vendure-admin-ui-settings.mjs +109 -109
- package/fesm2022/vendure-admin-ui-settings.mjs.map +1 -1
- package/fesm2022/vendure-admin-ui-system.mjs +16 -16
- package/fesm2022/vendure-admin-ui-system.mjs.map +1 -1
- package/package.json +2 -2
- package/static/theme.min.css +1 -1
|
@@ -259,10 +259,10 @@ class ProductDetailService {
|
|
|
259
259
|
}
|
|
260
260
|
}));
|
|
261
261
|
}
|
|
262
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
263
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.
|
|
262
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ProductDetailService, deps: [{ token: i1.DataService }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
263
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ProductDetailService, providedIn: 'root' }); }
|
|
264
264
|
}
|
|
265
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
265
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ProductDetailService, decorators: [{
|
|
266
266
|
type: Injectable,
|
|
267
267
|
args: [{
|
|
268
268
|
providedIn: 'root',
|
|
@@ -454,10 +454,10 @@ class ProductOptionsEditorComponent extends BaseDetailComponent {
|
|
|
454
454
|
}
|
|
455
455
|
return optionForm;
|
|
456
456
|
}
|
|
457
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
458
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: ProductOptionsEditorComponent, isStandalone: false, selector: "vdr-product-options-editor", usesInheritance: true, ngImport: i0, template: "<vdr-page-header>\n <vdr-page-title></vdr-page-title>\n <vdr-page-header-description>{{ 'catalog.page-description-options-editor' | translate }}</vdr-page-header-description>\n</vdr-page-header>\n<vdr-page-body>\n <vdr-page-block>\n <vdr-action-bar>\n <vdr-ab-left>\n <vdr-language-selector\n [availableLanguageCodes]=\"availableLanguages$ | async\"\n [currentLanguageCode]=\"languageCode$ | async\"\n (languageCodeChange)=\"setLanguage($event)\"\n ></vdr-language-selector>\n </vdr-ab-left>\n\n <vdr-ab-right>\n <div class=\"flex center\">\n <div class=\"mr-2\">\n <clr-checkbox-wrapper>\n <input\n clrCheckbox\n type=\"checkbox\"\n id=\"auto-update\"\n [(ngModel)]=\"autoUpdateVariantNames\"\n />\n <label>{{ 'catalog.auto-update-product-variant-name' | translate }}</label>\n </clr-checkbox-wrapper>\n </div>\n <button\n *vdrIfPermissions=\"updatePermission\"\n class=\"btn btn-primary\"\n (click)=\"save()\"\n [disabled]=\"detailForm.pristine || detailForm.invalid\"\n >\n {{ 'common.update' | translate }}\n </button>\n </div>\n </vdr-ab-right>\n </vdr-action-bar>\n </vdr-page-block>\n <vdr-page-block>\n <form class=\"form\" [formGroup]=\"detailForm\" *ngIf=\"optionGroups$ | async as optionGroups\">\n <div formGroupName=\"optionGroups\">\n <vdr-card\n *ngFor=\"let optionGroup of getOptionGroups(); index as i\"\n [formArrayName]=\"i\"\n [title]=\"optionGroup.value.code\"\n >\n <vdr-page-entity-info [entity]=\"optionGroup.value\"></vdr-page-entity-info>\n <div class=\"form-grid\">\n <vdr-form-field [label]=\"'common.name' | translate\" for=\"name\">\n <input\n [id]=\"'name-' + i\"\n type=\"text\"\n formControlName=\"name\"\n [readonly]=\"!(updatePermission | hasPermission)\"\n />\n </vdr-form-field>\n <vdr-form-field [label]=\"'common.code' | translate\" for=\"code\">\n <input\n [id]=\"'code-' + i\"\n type=\"text\"\n [readonly]=\"!(updatePermission | hasPermission)\"\n formControlName=\"code\"\n />\n </vdr-form-field>\n </div>\n <ng-container formGroupName=\"customFields\" *ngIf=\"optionGroupCustomFields.length\">\n <vdr-tabbed-custom-fields\n entityName=\"ProductOptionGroup\"\n [customFields]=\"optionGroupCustomFields\"\n [customFieldsFormGroup]=\"optionGroup.get('customFields')\"\n [readonly]=\"!(updatePermission | hasPermission)\"\n ></vdr-tabbed-custom-fields>\n </ng-container>\n\n <vdr-data-table-2\n id=\"edit-options-list\"\n *ngIf=\"getOptions(optionGroup) as options\"\n [items]=\"options\"\n [trackByPath]=\"'value.id'\"\n [itemsPerPage]=\"paginationSettings[optionGroup.value.id]?.itemsPerPage\"\n [currentPage]=\"paginationSettings[optionGroup.value.id]?.currentPage\"\n (pageChange)=\"paginationSettings[optionGroup.value.id].currentPage = $event\"\n (itemsPerPageChange)=\"paginationSettings[optionGroup.value.id].itemsPerPage = $event\"\n [totalItems]=\"options.length\"\n >\n <vdr-dt2-column [heading]=\"'common.id' | translate\" id=\"id\" [hiddenByDefault]=\"true\">\n <ng-template let-optionControl=\"item\">\n {{ optionControl.value.id }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.created-at' | translate\" id=\"created-at\" [hiddenByDefault]=\"true\">\n <ng-template let-optionControl=\"item\">\n {{ optionControl.value.createdAt | localeDate : 'short' }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.updated-at' | translate\" id=\"updated-at\" [hiddenByDefault]=\"true\">\n <ng-template let-optionControl=\"item\">\n {{ optionControl.value.updatedAt | localeDate : 'short' }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.name' | translate\" id=\"name\" [optional]=\"false\">\n <ng-template let-optionControl=\"item\">\n <input\n type=\"text\"\n [formControl]=\"optionControl.get('name')\"\n [readonly]=\"!(updatePermission | hasPermission)\"\n />\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.code' | translate\" id=\"code\" [optional]=\"false\">\n <ng-template let-optionControl=\"item\">\n <input type=\"text\" [formControl]=\"optionControl.get('code')\" />\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column\n [heading]=\"'common.custom-fields' | translate\" id=\"custom-fields\"\n [hiddenByDefault]=\"optionCustomFields.length === 0\"\n >\n <ng-template let-optionControl=\"item\">\n <vdr-tabbed-custom-fields\n entityName=\"ProductOption\"\n [customFields]=\"optionCustomFields\"\n [compact]=\"true\"\n [customFieldsFormGroup]=\"optionControl.get('customFields')\"\n [readonly]=\"!(updatePermission | hasPermission)\"\n ></vdr-tabbed-custom-fields>\n </ng-template>\n </vdr-dt2-column>\n </vdr-data-table-2>\n </vdr-card>\n </div>\n </form>\n </vdr-page-block>\n</vdr-page-body>\n", styles: [".option-group-header{display:flex;align-items:baseline}\n"], dependencies: [{ kind: "directive", type: i3.ClrLabel, selector: "label", inputs: ["id", "for"] }, { kind: "directive", type: i3.ClrCheckbox, selector: "[clrCheckbox],[clrToggle]" }, { kind: "component", type: i3.ClrCheckboxWrapper, selector: "clr-checkbox-wrapper,clr-toggle-wrapper" }, { kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i2.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i2.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "component", type: i1.ActionBarComponent, selector: "vdr-action-bar" }, { kind: "component", type: i1.ActionBarLeftComponent, selector: "vdr-ab-left", inputs: ["grow"] }, { kind: "component", type: i1.ActionBarRightComponent, selector: "vdr-ab-right", inputs: ["grow"] }, { kind: "component", type: i1.FormFieldComponent, selector: "vdr-form-field", inputs: ["label", "for", "tooltip", "errors", "readOnlyToggle"], outputs: ["readOnlyToggleChange"] }, { kind: "directive", type: i1.FormFieldControlDirective, selector: "input, textarea, select, vdr-currency-input" }, { kind: "component", type: i1.LanguageSelectorComponent, selector: "vdr-language-selector", inputs: ["currentLanguageCode", "availableLanguageCodes", "disabled"], outputs: ["languageCodeChange"] }, { kind: "directive", type: i1.IfPermissionsDirective, selector: "[vdrIfPermissions]", inputs: ["vdrIfPermissions", "vdrIfPermissionsElse"] }, { kind: "component", type: i1.TabbedCustomFieldsComponent, selector: "vdr-tabbed-custom-fields", inputs: ["entityName", "customFields", "customFieldsFormGroup", "readonly", "compact", "showLabel"] }, { kind: "component", type: i1.DataTable2Component, selector: "vdr-data-table-2", inputs: ["id", "items", "itemsPerPage", "currentPage", "totalItems", "emptyStateLabel", "filters", "activeIndex", "trackByPath"], outputs: ["pageChange", "itemsPerPageChange", "visibleColumnsChange"] }, { kind: "component", type: i1.DataTable2ColumnComponent, selector: "vdr-dt2-column", inputs: ["id", "expand", "heading", "align", "sort", "optional", "hiddenByDefault", "orderable"], exportAs: ["row"] }, { kind: "component", type: i1.PageHeaderComponent, selector: "vdr-page-header" }, { kind: "component", type: i1.PageTitleComponent, selector: "vdr-page-title", inputs: ["title"] }, { kind: "component", type: i1.PageHeaderDescriptionComponent, selector: "vdr-page-header-description" }, { kind: "component", type: i1.PageBodyComponent, selector: "vdr-page-body" }, { kind: "component", type: i1.PageBlockComponent, selector: "vdr-page-block" }, { kind: "component", type: i1.PageEntityInfoComponent, selector: "vdr-page-entity-info", inputs: ["entity"] }, { kind: "component", type: i1.CardComponent, selector: "vdr-card", inputs: ["title", "paddingX"] }, { kind: "pipe", type: i3$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }, { kind: "pipe", type: i1.HasPermissionPipe, name: "hasPermission" }, { kind: "pipe", type: i1.LocaleDatePipe, name: "localeDate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
457
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ProductOptionsEditorComponent, deps: [{ token: i1$1.ActivatedRoute }, { token: i1$1.Router }, { token: i1.ServerConfigService }, { token: i1.DataService }, { token: i1.PermissionsService }, { token: ProductDetailService }, { token: i2.UntypedFormBuilder }, { token: i0.ChangeDetectorRef }, { token: i1.NotificationService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
458
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: ProductOptionsEditorComponent, isStandalone: false, selector: "vdr-product-options-editor", usesInheritance: true, ngImport: i0, template: "<vdr-page-header>\n <vdr-page-title></vdr-page-title>\n <vdr-page-header-description>{{ 'catalog.page-description-options-editor' | translate }}</vdr-page-header-description>\n</vdr-page-header>\n<vdr-page-body>\n <vdr-page-block>\n <vdr-action-bar>\n <vdr-ab-left>\n <vdr-language-selector\n [availableLanguageCodes]=\"availableLanguages$ | async\"\n [currentLanguageCode]=\"languageCode$ | async\"\n (languageCodeChange)=\"setLanguage($event)\"\n ></vdr-language-selector>\n </vdr-ab-left>\n\n <vdr-ab-right>\n <div class=\"flex center\">\n <div class=\"mr-2\">\n <clr-checkbox-wrapper>\n <input\n clrCheckbox\n type=\"checkbox\"\n id=\"auto-update\"\n [(ngModel)]=\"autoUpdateVariantNames\"\n />\n <label>{{ 'catalog.auto-update-product-variant-name' | translate }}</label>\n </clr-checkbox-wrapper>\n </div>\n <button\n *vdrIfPermissions=\"updatePermission\"\n class=\"btn btn-primary\"\n (click)=\"save()\"\n [disabled]=\"detailForm.pristine || detailForm.invalid\"\n >\n {{ 'common.update' | translate }}\n </button>\n </div>\n </vdr-ab-right>\n </vdr-action-bar>\n </vdr-page-block>\n <vdr-page-block>\n <form class=\"form\" [formGroup]=\"detailForm\" *ngIf=\"optionGroups$ | async as optionGroups\">\n <div formGroupName=\"optionGroups\">\n <vdr-card\n *ngFor=\"let optionGroup of getOptionGroups(); index as i\"\n [formArrayName]=\"i\"\n [title]=\"optionGroup.value.code\"\n >\n <vdr-page-entity-info [entity]=\"optionGroup.value\"></vdr-page-entity-info>\n <div class=\"form-grid\">\n <vdr-form-field [label]=\"'common.name' | translate\" for=\"name\">\n <input\n [id]=\"'name-' + i\"\n type=\"text\"\n formControlName=\"name\"\n [readonly]=\"!(updatePermission | hasPermission)\"\n />\n </vdr-form-field>\n <vdr-form-field [label]=\"'common.code' | translate\" for=\"code\">\n <input\n [id]=\"'code-' + i\"\n type=\"text\"\n [readonly]=\"!(updatePermission | hasPermission)\"\n formControlName=\"code\"\n />\n </vdr-form-field>\n </div>\n <ng-container formGroupName=\"customFields\" *ngIf=\"optionGroupCustomFields.length\">\n <vdr-tabbed-custom-fields\n entityName=\"ProductOptionGroup\"\n [customFields]=\"optionGroupCustomFields\"\n [customFieldsFormGroup]=\"optionGroup.get('customFields')\"\n [readonly]=\"!(updatePermission | hasPermission)\"\n ></vdr-tabbed-custom-fields>\n </ng-container>\n\n <vdr-data-table-2\n id=\"edit-options-list\"\n *ngIf=\"getOptions(optionGroup) as options\"\n [items]=\"options\"\n [trackByPath]=\"'value.id'\"\n [itemsPerPage]=\"paginationSettings[optionGroup.value.id]?.itemsPerPage\"\n [currentPage]=\"paginationSettings[optionGroup.value.id]?.currentPage\"\n (pageChange)=\"paginationSettings[optionGroup.value.id].currentPage = $event\"\n (itemsPerPageChange)=\"paginationSettings[optionGroup.value.id].itemsPerPage = $event\"\n [totalItems]=\"options.length\"\n >\n <vdr-dt2-column [heading]=\"'common.id' | translate\" id=\"id\" [hiddenByDefault]=\"true\">\n <ng-template let-optionControl=\"item\">\n {{ optionControl.value.id }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.created-at' | translate\" id=\"created-at\" [hiddenByDefault]=\"true\">\n <ng-template let-optionControl=\"item\">\n {{ optionControl.value.createdAt | localeDate : 'short' }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.updated-at' | translate\" id=\"updated-at\" [hiddenByDefault]=\"true\">\n <ng-template let-optionControl=\"item\">\n {{ optionControl.value.updatedAt | localeDate : 'short' }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.name' | translate\" id=\"name\" [optional]=\"false\">\n <ng-template let-optionControl=\"item\">\n <input\n type=\"text\"\n [formControl]=\"optionControl.get('name')\"\n [readonly]=\"!(updatePermission | hasPermission)\"\n />\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.code' | translate\" id=\"code\" [optional]=\"false\">\n <ng-template let-optionControl=\"item\">\n <input type=\"text\" [formControl]=\"optionControl.get('code')\" />\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column\n [heading]=\"'common.custom-fields' | translate\" id=\"custom-fields\"\n [hiddenByDefault]=\"optionCustomFields.length === 0\"\n >\n <ng-template let-optionControl=\"item\">\n <vdr-tabbed-custom-fields\n entityName=\"ProductOption\"\n [customFields]=\"optionCustomFields\"\n [compact]=\"true\"\n [customFieldsFormGroup]=\"optionControl.get('customFields')\"\n [readonly]=\"!(updatePermission | hasPermission)\"\n ></vdr-tabbed-custom-fields>\n </ng-template>\n </vdr-dt2-column>\n </vdr-data-table-2>\n </vdr-card>\n </div>\n </form>\n </vdr-page-block>\n</vdr-page-body>\n", styles: [".option-group-header{display:flex;align-items:baseline}\n"], dependencies: [{ kind: "directive", type: i3.ClrLabel, selector: "label", inputs: ["id", "for"] }, { kind: "directive", type: i3.ClrCheckbox, selector: "[clrCheckbox],[clrToggle]" }, { kind: "component", type: i3.ClrCheckboxWrapper, selector: "clr-checkbox-wrapper,clr-toggle-wrapper" }, { kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i2.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i2.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "component", type: i1.ActionBarComponent, selector: "vdr-action-bar" }, { kind: "component", type: i1.ActionBarLeftComponent, selector: "vdr-ab-left", inputs: ["grow"] }, { kind: "component", type: i1.ActionBarRightComponent, selector: "vdr-ab-right", inputs: ["grow"] }, { kind: "component", type: i1.FormFieldComponent, selector: "vdr-form-field", inputs: ["label", "for", "tooltip", "errors", "readOnlyToggle"], outputs: ["readOnlyToggleChange"] }, { kind: "directive", type: i1.FormFieldControlDirective, selector: "input, textarea, select, vdr-currency-input" }, { kind: "component", type: i1.LanguageSelectorComponent, selector: "vdr-language-selector", inputs: ["currentLanguageCode", "availableLanguageCodes", "disabled"], outputs: ["languageCodeChange"] }, { kind: "directive", type: i1.IfPermissionsDirective, selector: "[vdrIfPermissions]", inputs: ["vdrIfPermissions", "vdrIfPermissionsElse"] }, { kind: "component", type: i1.TabbedCustomFieldsComponent, selector: "vdr-tabbed-custom-fields", inputs: ["entityName", "customFields", "customFieldsFormGroup", "readonly", "compact", "showLabel"] }, { kind: "component", type: i1.DataTable2Component, selector: "vdr-data-table-2", inputs: ["id", "items", "itemsPerPage", "currentPage", "totalItems", "emptyStateLabel", "filters", "activeIndex", "trackByPath"], outputs: ["pageChange", "itemsPerPageChange", "visibleColumnsChange"] }, { kind: "component", type: i1.DataTable2ColumnComponent, selector: "vdr-dt2-column", inputs: ["id", "expand", "heading", "align", "sort", "optional", "hiddenByDefault", "orderable"], exportAs: ["row"] }, { kind: "component", type: i1.PageHeaderComponent, selector: "vdr-page-header" }, { kind: "component", type: i1.PageTitleComponent, selector: "vdr-page-title", inputs: ["title"] }, { kind: "component", type: i1.PageHeaderDescriptionComponent, selector: "vdr-page-header-description" }, { kind: "component", type: i1.PageBodyComponent, selector: "vdr-page-body" }, { kind: "component", type: i1.PageBlockComponent, selector: "vdr-page-block" }, { kind: "component", type: i1.PageEntityInfoComponent, selector: "vdr-page-entity-info", inputs: ["entity"] }, { kind: "component", type: i1.CardComponent, selector: "vdr-card", inputs: ["title", "paddingX"] }, { kind: "pipe", type: i3$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }, { kind: "pipe", type: i1.HasPermissionPipe, name: "hasPermission" }, { kind: "pipe", type: i1.LocaleDatePipe, name: "localeDate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
459
459
|
}
|
|
460
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
460
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ProductOptionsEditorComponent, decorators: [{
|
|
461
461
|
type: Component,
|
|
462
462
|
args: [{ selector: 'vdr-product-options-editor', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<vdr-page-header>\n <vdr-page-title></vdr-page-title>\n <vdr-page-header-description>{{ 'catalog.page-description-options-editor' | translate }}</vdr-page-header-description>\n</vdr-page-header>\n<vdr-page-body>\n <vdr-page-block>\n <vdr-action-bar>\n <vdr-ab-left>\n <vdr-language-selector\n [availableLanguageCodes]=\"availableLanguages$ | async\"\n [currentLanguageCode]=\"languageCode$ | async\"\n (languageCodeChange)=\"setLanguage($event)\"\n ></vdr-language-selector>\n </vdr-ab-left>\n\n <vdr-ab-right>\n <div class=\"flex center\">\n <div class=\"mr-2\">\n <clr-checkbox-wrapper>\n <input\n clrCheckbox\n type=\"checkbox\"\n id=\"auto-update\"\n [(ngModel)]=\"autoUpdateVariantNames\"\n />\n <label>{{ 'catalog.auto-update-product-variant-name' | translate }}</label>\n </clr-checkbox-wrapper>\n </div>\n <button\n *vdrIfPermissions=\"updatePermission\"\n class=\"btn btn-primary\"\n (click)=\"save()\"\n [disabled]=\"detailForm.pristine || detailForm.invalid\"\n >\n {{ 'common.update' | translate }}\n </button>\n </div>\n </vdr-ab-right>\n </vdr-action-bar>\n </vdr-page-block>\n <vdr-page-block>\n <form class=\"form\" [formGroup]=\"detailForm\" *ngIf=\"optionGroups$ | async as optionGroups\">\n <div formGroupName=\"optionGroups\">\n <vdr-card\n *ngFor=\"let optionGroup of getOptionGroups(); index as i\"\n [formArrayName]=\"i\"\n [title]=\"optionGroup.value.code\"\n >\n <vdr-page-entity-info [entity]=\"optionGroup.value\"></vdr-page-entity-info>\n <div class=\"form-grid\">\n <vdr-form-field [label]=\"'common.name' | translate\" for=\"name\">\n <input\n [id]=\"'name-' + i\"\n type=\"text\"\n formControlName=\"name\"\n [readonly]=\"!(updatePermission | hasPermission)\"\n />\n </vdr-form-field>\n <vdr-form-field [label]=\"'common.code' | translate\" for=\"code\">\n <input\n [id]=\"'code-' + i\"\n type=\"text\"\n [readonly]=\"!(updatePermission | hasPermission)\"\n formControlName=\"code\"\n />\n </vdr-form-field>\n </div>\n <ng-container formGroupName=\"customFields\" *ngIf=\"optionGroupCustomFields.length\">\n <vdr-tabbed-custom-fields\n entityName=\"ProductOptionGroup\"\n [customFields]=\"optionGroupCustomFields\"\n [customFieldsFormGroup]=\"optionGroup.get('customFields')\"\n [readonly]=\"!(updatePermission | hasPermission)\"\n ></vdr-tabbed-custom-fields>\n </ng-container>\n\n <vdr-data-table-2\n id=\"edit-options-list\"\n *ngIf=\"getOptions(optionGroup) as options\"\n [items]=\"options\"\n [trackByPath]=\"'value.id'\"\n [itemsPerPage]=\"paginationSettings[optionGroup.value.id]?.itemsPerPage\"\n [currentPage]=\"paginationSettings[optionGroup.value.id]?.currentPage\"\n (pageChange)=\"paginationSettings[optionGroup.value.id].currentPage = $event\"\n (itemsPerPageChange)=\"paginationSettings[optionGroup.value.id].itemsPerPage = $event\"\n [totalItems]=\"options.length\"\n >\n <vdr-dt2-column [heading]=\"'common.id' | translate\" id=\"id\" [hiddenByDefault]=\"true\">\n <ng-template let-optionControl=\"item\">\n {{ optionControl.value.id }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.created-at' | translate\" id=\"created-at\" [hiddenByDefault]=\"true\">\n <ng-template let-optionControl=\"item\">\n {{ optionControl.value.createdAt | localeDate : 'short' }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.updated-at' | translate\" id=\"updated-at\" [hiddenByDefault]=\"true\">\n <ng-template let-optionControl=\"item\">\n {{ optionControl.value.updatedAt | localeDate : 'short' }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.name' | translate\" id=\"name\" [optional]=\"false\">\n <ng-template let-optionControl=\"item\">\n <input\n type=\"text\"\n [formControl]=\"optionControl.get('name')\"\n [readonly]=\"!(updatePermission | hasPermission)\"\n />\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.code' | translate\" id=\"code\" [optional]=\"false\">\n <ng-template let-optionControl=\"item\">\n <input type=\"text\" [formControl]=\"optionControl.get('code')\" />\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column\n [heading]=\"'common.custom-fields' | translate\" id=\"custom-fields\"\n [hiddenByDefault]=\"optionCustomFields.length === 0\"\n >\n <ng-template let-optionControl=\"item\">\n <vdr-tabbed-custom-fields\n entityName=\"ProductOption\"\n [customFields]=\"optionCustomFields\"\n [compact]=\"true\"\n [customFieldsFormGroup]=\"optionControl.get('customFields')\"\n [readonly]=\"!(updatePermission | hasPermission)\"\n ></vdr-tabbed-custom-fields>\n </ng-template>\n </vdr-dt2-column>\n </vdr-data-table-2>\n </vdr-card>\n </div>\n </form>\n </vdr-page-block>\n</vdr-page-body>\n", styles: [".option-group-header{display:flex;align-items:baseline}\n"] }]
|
|
463
463
|
}], ctorParameters: () => [{ type: i1$1.ActivatedRoute }, { type: i1$1.Router }, { type: i1.ServerConfigService }, { type: i1.DataService }, { type: i1.PermissionsService }, { type: ProductDetailService }, { type: i2.UntypedFormBuilder }, { type: i0.ChangeDetectorRef }, { type: i1.NotificationService }] });
|
|
@@ -491,10 +491,10 @@ class CreateProductOptionGroupDialogComponent {
|
|
|
491
491
|
cancel() {
|
|
492
492
|
this.resolveWith();
|
|
493
493
|
}
|
|
494
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
495
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
494
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: CreateProductOptionGroupDialogComponent, deps: [{ token: i2.FormBuilder }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
495
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: CreateProductOptionGroupDialogComponent, isStandalone: false, selector: "vdr-create-product-option-group-dialog", ngImport: i0, template: "<ng-template vdrDialogTitle>\n {{ 'catalog.create-product-option-group' | translate }}\n</ng-template>\n<div class=\"form-grid\" [formGroup]=\"form\">\n <vdr-form-field [label]=\"'common.name' | translate\" for=\"name\">\n <input id=\"name\" type=\"text\" formControlName=\"name\" (input)=\"updateCode()\" />\n </vdr-form-field>\n <vdr-form-field\n [label]=\"'common.code' | translate\"\n for=\"code\"\n >\n <input\n id=\"code\"\n type=\"text\"\n formControlName=\"code\"\n />\n </vdr-form-field>\n</div>\n<ng-template vdrDialogButtons>\n <button type=\"button\" class=\"btn\" (click)=\"cancel()\">{{ 'common.cancel' | translate }}</button>\n <button type=\"submit\" (click)=\"confirm()\" class=\"btn btn-primary\" [disabled]=\"form.invalid\">\n {{ 'common.confirm' | translate }}\n </button>\n</ng-template>\n", styles: [""], dependencies: [{ kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i1.FormFieldComponent, selector: "vdr-form-field", inputs: ["label", "for", "tooltip", "errors", "readOnlyToggle"], outputs: ["readOnlyToggleChange"] }, { kind: "directive", type: i1.FormFieldControlDirective, selector: "input, textarea, select, vdr-currency-input" }, { kind: "directive", type: i1.DialogButtonsDirective, selector: "[vdrDialogButtons]" }, { kind: "directive", type: i1.DialogTitleDirective, selector: "[vdrDialogTitle]" }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
496
496
|
}
|
|
497
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
497
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: CreateProductOptionGroupDialogComponent, decorators: [{
|
|
498
498
|
type: Component,
|
|
499
499
|
args: [{ selector: 'vdr-create-product-option-group-dialog', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<ng-template vdrDialogTitle>\n {{ 'catalog.create-product-option-group' | translate }}\n</ng-template>\n<div class=\"form-grid\" [formGroup]=\"form\">\n <vdr-form-field [label]=\"'common.name' | translate\" for=\"name\">\n <input id=\"name\" type=\"text\" formControlName=\"name\" (input)=\"updateCode()\" />\n </vdr-form-field>\n <vdr-form-field\n [label]=\"'common.code' | translate\"\n for=\"code\"\n >\n <input\n id=\"code\"\n type=\"text\"\n formControlName=\"code\"\n />\n </vdr-form-field>\n</div>\n<ng-template vdrDialogButtons>\n <button type=\"button\" class=\"btn\" (click)=\"cancel()\">{{ 'common.cancel' | translate }}</button>\n <button type=\"submit\" (click)=\"confirm()\" class=\"btn btn-primary\" [disabled]=\"form.invalid\">\n {{ 'common.confirm' | translate }}\n </button>\n</ng-template>\n" }]
|
|
500
500
|
}], ctorParameters: () => [{ type: i2.FormBuilder }] });
|
|
@@ -561,10 +561,10 @@ class CreateProductVariantDialogComponent {
|
|
|
561
561
|
getGroupIdFromCode(code) {
|
|
562
562
|
return this.product.optionGroups.find(og => og.code === code)?.id ?? '';
|
|
563
563
|
}
|
|
564
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
565
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
564
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: CreateProductVariantDialogComponent, deps: [{ token: i2.FormBuilder }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
565
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: CreateProductVariantDialogComponent, isStandalone: false, selector: "vdr-create-product-variant-dialog", ngImport: i0, template: "<ng-template vdrDialogTitle>\n {{ 'catalog.create-product-variant' | translate }}\n</ng-template>\n<form [formGroup]=\"form\">\n <div formGroupName=\"options\" class=\"form-grid\">\n <vdr-form-field [label]=\"optionGroup.name\" *ngFor=\"let optionGroup of product.optionGroups\">\n <ng-select [items]=\"optionGroup.options\" [formControlName]=\"optionGroup.code\" bindLabel=\"name\"\n bindValue=\"id\" appendTo=\"body\">\n </ng-select>\n </vdr-form-field>\n <clr-alert *ngIf=\"product.optionGroups.length === 0\" clrAlertType=\"warning\" [clrAlertClosable]=\"false\"\n class=\"form-grid-span\">\n <clr-alert-item>\n <span class=\"alert-text\">\n {{ 'catalog.cannot-create-variants-without-options' | translate }}\n </span>\n </clr-alert-item>\n </clr-alert>\n </div>\n <div *ngIf=\"existingVariant\" class=\"mt-2\">\n <clr-alert clrAlertType=\"warning\" [clrAlertClosable]=\"false\" class=\"\">\n <clr-alert-item>\n <span class=\"alert-text\">\n {{ 'catalog.product-variant-exists' | translate }}: {{ existingVariant.name }} ({{\n existingVariant.sku\n }})\n </span>\n </clr-alert-item>\n </clr-alert>\n </div>\n <div class=\"form-grid mt-2\">\n <vdr-form-field [label]=\"'common.name' | translate\">\n <input type=\"text\" formControlName=\"name\" />\n </vdr-form-field>\n <vdr-form-field [label]=\"'catalog.sku' | translate\">\n <input type=\"text\" formControlName=\"sku\" />\n </vdr-form-field>\n <vdr-form-field [label]=\"'catalog.price' | translate\">\n <vdr-currency-input name=\"price\" [currencyCode]=\"currencyCode\" formControlName=\"price\" />\n </vdr-form-field>\n </div>\n</form>\n<ng-template vdrDialogButtons>\n <button type=\"button\" class=\"btn\" (click)=\"cancel()\">{{ 'common.cancel' | translate }}</button>\n <button type=\"submit\" (click)=\"confirm()\" class=\"btn btn-primary\"\n [disabled]=\"form.invalid || existingVariant || product.optionGroups.length === 0\">\n {{ 'common.confirm' | translate }}\n </button>\n</ng-template>", styles: [""], dependencies: [{ kind: "component", type: i3.ClrAlert, selector: "clr-alert", inputs: ["clrAlertSizeSmall", "clrAlertClosable", "clrAlertAppLevel", "clrCloseButtonAriaLabel", "clrAlertLightweight", "clrAlertType", "clrAlertIcon", "clrAlertClosed"], outputs: ["clrAlertClosedChange"] }, { kind: "component", type: i3.ClrAlertItem, selector: "clr-alert-item" }, { kind: "directive", type: i3.ClrAlertText, selector: ".alert-text" }, { kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i2.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "component", type: i5$1.NgSelectComponent, selector: "ng-select", inputs: ["ariaLabelDropdown", "bindLabel", "bindValue", "ariaLabel", "markFirst", "placeholder", "fixedPlaceholder", "notFoundText", "typeToSearchText", "preventToggleOnRightClick", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "tabFocusOnClearButton", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "ngClass", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd", "deselectOnClick", "keyDownFn"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }, { kind: "component", type: i1.CurrencyInputComponent, selector: "vdr-currency-input", inputs: ["disabled", "readonly", "value", "currencyCode"], outputs: ["valueChange"] }, { kind: "component", type: i1.FormFieldComponent, selector: "vdr-form-field", inputs: ["label", "for", "tooltip", "errors", "readOnlyToggle"], outputs: ["readOnlyToggleChange"] }, { kind: "directive", type: i1.FormFieldControlDirective, selector: "input, textarea, select, vdr-currency-input" }, { kind: "directive", type: i1.DialogButtonsDirective, selector: "[vdrDialogButtons]" }, { kind: "directive", type: i1.DialogTitleDirective, selector: "[vdrDialogTitle]" }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
566
566
|
}
|
|
567
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
567
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: CreateProductVariantDialogComponent, decorators: [{
|
|
568
568
|
type: Component,
|
|
569
569
|
args: [{ selector: 'vdr-create-product-variant-dialog', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<ng-template vdrDialogTitle>\n {{ 'catalog.create-product-variant' | translate }}\n</ng-template>\n<form [formGroup]=\"form\">\n <div formGroupName=\"options\" class=\"form-grid\">\n <vdr-form-field [label]=\"optionGroup.name\" *ngFor=\"let optionGroup of product.optionGroups\">\n <ng-select [items]=\"optionGroup.options\" [formControlName]=\"optionGroup.code\" bindLabel=\"name\"\n bindValue=\"id\" appendTo=\"body\">\n </ng-select>\n </vdr-form-field>\n <clr-alert *ngIf=\"product.optionGroups.length === 0\" clrAlertType=\"warning\" [clrAlertClosable]=\"false\"\n class=\"form-grid-span\">\n <clr-alert-item>\n <span class=\"alert-text\">\n {{ 'catalog.cannot-create-variants-without-options' | translate }}\n </span>\n </clr-alert-item>\n </clr-alert>\n </div>\n <div *ngIf=\"existingVariant\" class=\"mt-2\">\n <clr-alert clrAlertType=\"warning\" [clrAlertClosable]=\"false\" class=\"\">\n <clr-alert-item>\n <span class=\"alert-text\">\n {{ 'catalog.product-variant-exists' | translate }}: {{ existingVariant.name }} ({{\n existingVariant.sku\n }})\n </span>\n </clr-alert-item>\n </clr-alert>\n </div>\n <div class=\"form-grid mt-2\">\n <vdr-form-field [label]=\"'common.name' | translate\">\n <input type=\"text\" formControlName=\"name\" />\n </vdr-form-field>\n <vdr-form-field [label]=\"'catalog.sku' | translate\">\n <input type=\"text\" formControlName=\"sku\" />\n </vdr-form-field>\n <vdr-form-field [label]=\"'catalog.price' | translate\">\n <vdr-currency-input name=\"price\" [currencyCode]=\"currencyCode\" formControlName=\"price\" />\n </vdr-form-field>\n </div>\n</form>\n<ng-template vdrDialogButtons>\n <button type=\"button\" class=\"btn\" (click)=\"cancel()\">{{ 'common.cancel' | translate }}</button>\n <button type=\"submit\" (click)=\"confirm()\" class=\"btn btn-primary\"\n [disabled]=\"form.invalid || existingVariant || product.optionGroups.length === 0\">\n {{ 'common.confirm' | translate }}\n </button>\n</ng-template>" }]
|
|
570
570
|
}], ctorParameters: () => [{ type: i2.FormBuilder }] });
|
|
@@ -692,10 +692,10 @@ class OptionValueInputComponent {
|
|
|
692
692
|
this.removeOption(option);
|
|
693
693
|
}
|
|
694
694
|
}
|
|
695
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
696
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
695
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: OptionValueInputComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
696
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: OptionValueInputComponent, isStandalone: false, selector: "vdr-option-value-input", inputs: { groupName: "groupName", options: "options", disabled: "disabled" }, outputs: { add: "add", remove: "remove", edit: "edit" }, providers: [OPTION_VALUE_INPUT_VALUE_ACCESSOR], viewQueries: [{ propertyName: "textArea", first: true, predicate: ["textArea"], descendants: true, static: true }, { propertyName: "nameInputs", predicate: ["editNameInput"], descendants: true, read: ElementRef }], ngImport: i0, template: "<div class=\"input-wrapper\" [class.focus]=\"isFocussed\" (click)=\"textArea.focus()\">\n <div class=\"chips\" *ngIf=\"0 < optionValues.length\">\n <vdr-chip\n *ngFor=\"let option of optionValues; last as isLast; index as i\"\n [icon]=\"option.locked ? 'lock' : 'times'\"\n [class.selected]=\"isLast && lastSelected\"\n [class.locked]=\"option.locked\"\n [colorFrom]=\"groupName\"\n (iconClick)=\"removeOption(option)\"\n >\n <span [hidden]=\"editingIndex !== i\">\n <input\n #editNameInput\n type=\"text\"\n [ngModel]=\"option.name\"\n (blur)=\"updateOption(i, $event)\"\n (click)=\"$event.cancelBubble = true\"\n />\n </span>\n <span\n class=\"option-name\"\n [class.editable]=\"!option.locked && !option.id\"\n (click)=\"editName(i, $event)\" [hidden]=\"editingIndex === i\">{{ option.name }}</span>\n </vdr-chip>\n </div>\n <textarea\n #textArea\n (keyup)=\"handleKey($event)\"\n (focus)=\"isFocussed = true\"\n (blur)=\"handleBlur()\"\n [(ngModel)]=\"input\"\n [disabled]=\"disabled\"\n ></textarea>\n</div>\n", styles: [".input-wrapper{background-color:var(--color-form-input-bg);border-radius:3px!important;border:1px solid var(--color-grey-300)!important;cursor:text}.input-wrapper.focus{border-color:var(--color-primary-500)!important;box-shadow:0 0 1px 1px var(--color-primary-100)}.input-wrapper .chips{padding:5px}.input-wrapper textarea{border:none;width:100%;height:24px;margin-top:3px;padding:0 6px}.input-wrapper textarea:focus{outline:none;box-shadow:none}.input-wrapper textarea:disabled{background-color:var(--color-component-bg-100)}vdr-chip ::ng-deep .wrapper{margin:0 3px}vdr-chip.locked{opacity:.8}vdr-chip.selected ::ng-deep .wrapper{border-color:var(--color-warning-500)!important;box-shadow:0 0 1px 1px var(--color-warning-400);opacity:.6}vdr-chip .option-name.editable:hover{outline:1px solid var(--color-component-bg-300);outline-offset:1px;border-radius:1px}vdr-chip input{padding:0!important;margin-top:-2px;margin-bottom:-2px}\n"], dependencies: [{ kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { 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: "component", type: i1.ChipComponent, selector: "vdr-chip", inputs: ["icon", "invert", "colorFrom", "colorType"], outputs: ["iconClick"] }, { kind: "directive", type: i1.FormFieldControlDirective, selector: "input, textarea, select, vdr-currency-input" }], changeDetection: i0.ChangeDetectionStrategy.Default }); }
|
|
697
697
|
}
|
|
698
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
698
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: OptionValueInputComponent, decorators: [{
|
|
699
699
|
type: Component,
|
|
700
700
|
args: [{ selector: 'vdr-option-value-input', changeDetection: ChangeDetectionStrategy.Default, providers: [OPTION_VALUE_INPUT_VALUE_ACCESSOR], standalone: false, template: "<div class=\"input-wrapper\" [class.focus]=\"isFocussed\" (click)=\"textArea.focus()\">\n <div class=\"chips\" *ngIf=\"0 < optionValues.length\">\n <vdr-chip\n *ngFor=\"let option of optionValues; last as isLast; index as i\"\n [icon]=\"option.locked ? 'lock' : 'times'\"\n [class.selected]=\"isLast && lastSelected\"\n [class.locked]=\"option.locked\"\n [colorFrom]=\"groupName\"\n (iconClick)=\"removeOption(option)\"\n >\n <span [hidden]=\"editingIndex !== i\">\n <input\n #editNameInput\n type=\"text\"\n [ngModel]=\"option.name\"\n (blur)=\"updateOption(i, $event)\"\n (click)=\"$event.cancelBubble = true\"\n />\n </span>\n <span\n class=\"option-name\"\n [class.editable]=\"!option.locked && !option.id\"\n (click)=\"editName(i, $event)\" [hidden]=\"editingIndex === i\">{{ option.name }}</span>\n </vdr-chip>\n </div>\n <textarea\n #textArea\n (keyup)=\"handleKey($event)\"\n (focus)=\"isFocussed = true\"\n (blur)=\"handleBlur()\"\n [(ngModel)]=\"input\"\n [disabled]=\"disabled\"\n ></textarea>\n</div>\n", styles: [".input-wrapper{background-color:var(--color-form-input-bg);border-radius:3px!important;border:1px solid var(--color-grey-300)!important;cursor:text}.input-wrapper.focus{border-color:var(--color-primary-500)!important;box-shadow:0 0 1px 1px var(--color-primary-100)}.input-wrapper .chips{padding:5px}.input-wrapper textarea{border:none;width:100%;height:24px;margin-top:3px;padding:0 6px}.input-wrapper textarea:focus{outline:none;box-shadow:none}.input-wrapper textarea:disabled{background-color:var(--color-component-bg-100)}vdr-chip ::ng-deep .wrapper{margin:0 3px}vdr-chip.locked{opacity:.8}vdr-chip.selected ::ng-deep .wrapper{border-color:var(--color-warning-500)!important;box-shadow:0 0 1px 1px var(--color-warning-400);opacity:.6}vdr-chip .option-name.editable:hover{outline:1px solid var(--color-component-bg-300);outline-offset:1px;border-radius:1px}vdr-chip input{padding:0!important;margin-top:-2px;margin-bottom:-2px}\n"] }]
|
|
701
701
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { groupName: [{
|
|
@@ -982,10 +982,10 @@ class ProductVariantsEditorComponent {
|
|
|
982
982
|
getOption(variant, groupId) {
|
|
983
983
|
return variant.options.find(o => o.groupId === groupId);
|
|
984
984
|
}
|
|
985
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
986
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: ProductVariantsEditorComponent, isStandalone: false, selector: "vdr-product-variants-editor", ngImport: i0, template: "<vdr-page-block>\n <vdr-card>\n <div *ngFor=\"let group of optionGroups; index as i\" class=\"option-groups\">\n <vdr-form-field [label]=\"'catalog.option' | translate\">\n <input clrInput [(ngModel)]=\"group.name\" name=\"name\" [readonly]=\"!group.isNew\" />\n </vdr-form-field>\n <vdr-form-field [label]=\"'catalog.option-values' | translate\" class=\"flex-spacer\">\n <vdr-option-value-input\n #optionValueInputComponent\n [options]=\"group.values\"\n [groupName]=\"group.name\"\n [disabled]=\"group.name === ''\"\n (add)=\"addOption(i, $event.name)\"\n (remove)=\"removeOption(i, $event)\"\n ></vdr-option-value-input>\n </vdr-form-field>\n <div>\n <button class=\"button-small mt-4\" (click)=\"removeOptionGroup(group)\">\n <clr-icon shape=\"trash\"></clr-icon>\n </button>\n </div>\n </div>\n <button class=\"button mt-1\" (click)=\"addOptionGroup()\">\n <clr-icon shape=\"plus\"></clr-icon>\n {{ 'catalog.create-product-option-group' | translate }}\n </button>\n </vdr-card>\n <vdr-card [paddingX]=\"false\">\n <div class=\"mx-3\">\n <button class=\"button\" (click)=\"createNewVariant()\">\n <clr-icon shape=\"plus\"></clr-icon>\n {{ 'catalog.create-product-variant' | translate }}\n </button>\n </div>\n <vdr-data-table-2\n id=\"manage-product-variant-list\"\n [items]=\"variants$ | async\"\n [itemsPerPage]=\"itemsPerPage\"\n [totalItems]=\"totalItems$ | async\"\n [currentPage]=\"currentPage\"\n (pageChange)=\"setPageNumber($event)\"\n (itemsPerPageChange)=\"setItemsPerPage($event)\"\n >\n <vdr-dt2-search\n [searchTermControl]=\"searchTermControl\"\n [searchTermPlaceholder]=\"'catalog.filter-by-name' | translate\"\n />\n <vdr-dt2-column [heading]=\"'common.id' | translate\" id=\"id\" [hiddenByDefault]=\"true\">\n <ng-template let-variant=\"item\">\n {{ variant.id }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.created-at' | translate\" id=\"created-at\" [hiddenByDefault]=\"true\">\n <ng-template let-variant=\"item\">\n {{ variant.createdAt | localeDate : 'short' }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.updated-at' | translate\" id=\"updated-at\" [hiddenByDefault]=\"true\">\n <ng-template let-variant=\"item\">\n {{ variant.updatedAt | localeDate : 'short' }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'catalog.name' | translate\" id=\"name\" [optional]=\"false\">\n <ng-template let-variant=\"item\">\n {{ variant.name }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'catalog.sku' | translate\" id=\"sku\" [optional]=\"false\">\n <ng-template let-variant=\"item\">\n {{ variant.sku }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column *ngFor=\"let optionGroup of optionGroups$ | async\" [heading]=\"optionGroup.name\" [id]=\"optionGroup.code\">\n <ng-template let-variant=\"item\">\n <vdr-chip\n *ngIf=\"getOption(variant, optionGroup.id) as option; else selectOption\"\n [colorFrom]=\"optionGroup.code\"\n >{{ option.name }}</vdr-chip\n >\n <ng-template #selectOption>\n <div class=\"flex center\">\n <ng-select\n [items]=\"optionGroup.options\"\n bindLabel=\"name\"\n bindValue=\"id\"\n appendTo=\"body\"\n (change)=\"setOptionToAddToVariant(variant.id, optionGroup.id, $event?.id)\"\n ></ng-select>\n <button\n class=\"button-small ml-1\"\n [class.primary]=\"!!optionsToAddToVariant[variant.id]?.[optionGroup.id]\"\n (click)=\"addOptionToVariant(variant)\"\n [disabled]=\"!optionsToAddToVariant[variant.id]?.[optionGroup.id]\"\n >\n <clr-icon shape=\"floppy\"></clr-icon>\n </button>\n </div>\n </ng-template>\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.price' | translate\" id=\"price\" [hiddenByDefault]=\"true\">\n <ng-template let-variant=\"item\">\n {{ variant.price | localeCurrency : variant.currencyCode }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.price-with-tax' | translate\" id=\"price-with-tax\" [hiddenByDefault]=\"true\">\n <ng-template let-variant=\"item\">\n {{ variant.priceWithTax | localeCurrency : variant.currencyCode }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.delete' | translate\" id=\"delete\" [optional]=\"false\">\n <ng-template let-variant=\"item\">\n <button class=\"button-small\" (click)=\"deleteVariant(variant)\">\n <clr-icon shape=\"trash is-danger\"></clr-icon>\n </button>\n </ng-template>\n </vdr-dt2-column>\n </vdr-data-table-2>\n </vdr-card>\n</vdr-page-block>\n", styles: [".option-groups{display:flex;width:100%;gap:var(--space-unit)}.values{flex:1;margin:0 6px}.variants-preview tr.disabled td{background-color:var(--color-component-bg-100);color:var(--color-grey-400)}\n"], dependencies: [{ kind: "directive", type: i3.ClrIconCustomTag, selector: "clr-icon" }, { kind: "directive", type: i3.ClrInput, selector: "[clrInput]" }, { kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { 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: "component", type: i5$1.NgSelectComponent, selector: "ng-select", inputs: ["ariaLabelDropdown", "bindLabel", "bindValue", "ariaLabel", "markFirst", "placeholder", "fixedPlaceholder", "notFoundText", "typeToSearchText", "preventToggleOnRightClick", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "tabFocusOnClearButton", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "ngClass", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd", "deselectOnClick", "keyDownFn"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }, { kind: "component", type: i1.ChipComponent, selector: "vdr-chip", inputs: ["icon", "invert", "colorFrom", "colorType"], outputs: ["iconClick"] }, { kind: "component", type: i1.FormFieldComponent, selector: "vdr-form-field", inputs: ["label", "for", "tooltip", "errors", "readOnlyToggle"], outputs: ["readOnlyToggleChange"] }, { kind: "directive", type: i1.FormFieldControlDirective, selector: "input, textarea, select, vdr-currency-input" }, { kind: "component", type: i1.DataTable2Component, selector: "vdr-data-table-2", inputs: ["id", "items", "itemsPerPage", "currentPage", "totalItems", "emptyStateLabel", "filters", "activeIndex", "trackByPath"], outputs: ["pageChange", "itemsPerPageChange", "visibleColumnsChange"] }, { kind: "component", type: i1.DataTable2ColumnComponent, selector: "vdr-dt2-column", inputs: ["id", "expand", "heading", "align", "sort", "optional", "hiddenByDefault", "orderable"], exportAs: ["row"] }, { kind: "component", type: i1.DataTable2SearchComponent, selector: "vdr-dt2-search", inputs: ["searchTermControl", "searchTermPlaceholder"] }, { kind: "component", type: i1.PageBlockComponent, selector: "vdr-page-block" }, { kind: "component", type: i1.CardComponent, selector: "vdr-card", inputs: ["title", "paddingX"] }, { kind: "component", type: OptionValueInputComponent, selector: "vdr-option-value-input", inputs: ["groupName", "options", "disabled"], outputs: ["add", "remove", "edit"] }, { kind: "pipe", type: i3$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }, { kind: "pipe", type: i1.LocaleDatePipe, name: "localeDate" }, { kind: "pipe", type: i1.LocaleCurrencyPipe, name: "localeCurrency" }], changeDetection: i0.ChangeDetectionStrategy.Default }); }
|
|
985
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ProductVariantsEditorComponent, deps: [{ token: i1$1.ActivatedRoute }, { token: i1.DataService }, { token: ProductDetailService }, { token: i1.NotificationService }, { token: i1.ModalService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
986
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: ProductVariantsEditorComponent, isStandalone: false, selector: "vdr-product-variants-editor", ngImport: i0, template: "<vdr-page-block>\n <vdr-card>\n <div *ngFor=\"let group of optionGroups; index as i\" class=\"option-groups\">\n <vdr-form-field [label]=\"'catalog.option' | translate\">\n <input clrInput [(ngModel)]=\"group.name\" name=\"name\" [readonly]=\"!group.isNew\" />\n </vdr-form-field>\n <vdr-form-field [label]=\"'catalog.option-values' | translate\" class=\"flex-spacer\">\n <vdr-option-value-input\n #optionValueInputComponent\n [options]=\"group.values\"\n [groupName]=\"group.name\"\n [disabled]=\"group.name === ''\"\n (add)=\"addOption(i, $event.name)\"\n (remove)=\"removeOption(i, $event)\"\n ></vdr-option-value-input>\n </vdr-form-field>\n <div>\n <button class=\"button-small mt-4\" (click)=\"removeOptionGroup(group)\">\n <clr-icon shape=\"trash\"></clr-icon>\n </button>\n </div>\n </div>\n <button class=\"button mt-1\" (click)=\"addOptionGroup()\">\n <clr-icon shape=\"plus\"></clr-icon>\n {{ 'catalog.create-product-option-group' | translate }}\n </button>\n </vdr-card>\n <vdr-card [paddingX]=\"false\">\n <div class=\"mx-3\">\n <button class=\"button\" (click)=\"createNewVariant()\">\n <clr-icon shape=\"plus\"></clr-icon>\n {{ 'catalog.create-product-variant' | translate }}\n </button>\n </div>\n <vdr-data-table-2\n id=\"manage-product-variant-list\"\n [items]=\"variants$ | async\"\n [itemsPerPage]=\"itemsPerPage\"\n [totalItems]=\"totalItems$ | async\"\n [currentPage]=\"currentPage\"\n (pageChange)=\"setPageNumber($event)\"\n (itemsPerPageChange)=\"setItemsPerPage($event)\"\n >\n <vdr-dt2-search\n [searchTermControl]=\"searchTermControl\"\n [searchTermPlaceholder]=\"'catalog.filter-by-name' | translate\"\n />\n <vdr-dt2-column [heading]=\"'common.id' | translate\" id=\"id\" [hiddenByDefault]=\"true\">\n <ng-template let-variant=\"item\">\n {{ variant.id }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.created-at' | translate\" id=\"created-at\" [hiddenByDefault]=\"true\">\n <ng-template let-variant=\"item\">\n {{ variant.createdAt | localeDate : 'short' }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.updated-at' | translate\" id=\"updated-at\" [hiddenByDefault]=\"true\">\n <ng-template let-variant=\"item\">\n {{ variant.updatedAt | localeDate : 'short' }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'catalog.name' | translate\" id=\"name\" [optional]=\"false\">\n <ng-template let-variant=\"item\">\n {{ variant.name }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'catalog.sku' | translate\" id=\"sku\" [optional]=\"false\">\n <ng-template let-variant=\"item\">\n {{ variant.sku }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column *ngFor=\"let optionGroup of optionGroups$ | async\" [heading]=\"optionGroup.name\" [id]=\"optionGroup.code\">\n <ng-template let-variant=\"item\">\n <vdr-chip\n *ngIf=\"getOption(variant, optionGroup.id) as option; else selectOption\"\n [colorFrom]=\"optionGroup.code\"\n >{{ option.name }}</vdr-chip\n >\n <ng-template #selectOption>\n <div class=\"flex center\">\n <ng-select\n [items]=\"optionGroup.options\"\n bindLabel=\"name\"\n bindValue=\"id\"\n appendTo=\"body\"\n (change)=\"setOptionToAddToVariant(variant.id, optionGroup.id, $event?.id)\"\n ></ng-select>\n <button\n class=\"button-small ml-1\"\n [class.primary]=\"!!optionsToAddToVariant[variant.id]?.[optionGroup.id]\"\n (click)=\"addOptionToVariant(variant)\"\n [disabled]=\"!optionsToAddToVariant[variant.id]?.[optionGroup.id]\"\n >\n <clr-icon shape=\"floppy\"></clr-icon>\n </button>\n </div>\n </ng-template>\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.price' | translate\" id=\"price\" [hiddenByDefault]=\"true\">\n <ng-template let-variant=\"item\">\n {{ variant.price | localeCurrency : variant.currencyCode }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.price-with-tax' | translate\" id=\"price-with-tax\" [hiddenByDefault]=\"true\">\n <ng-template let-variant=\"item\">\n {{ variant.priceWithTax | localeCurrency : variant.currencyCode }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.delete' | translate\" id=\"delete\" [optional]=\"false\">\n <ng-template let-variant=\"item\">\n <button class=\"button-small\" (click)=\"deleteVariant(variant)\">\n <clr-icon shape=\"trash is-danger\"></clr-icon>\n </button>\n </ng-template>\n </vdr-dt2-column>\n </vdr-data-table-2>\n </vdr-card>\n</vdr-page-block>\n", styles: [".option-groups{display:flex;width:100%;gap:var(--space-unit)}.values{flex:1;margin:0 6px}.variants-preview tr.disabled td{background-color:var(--color-component-bg-100);color:var(--color-grey-400)}\n"], dependencies: [{ kind: "directive", type: i3.ClrIconCustomTag, selector: "clr-icon" }, { kind: "directive", type: i3.ClrInput, selector: "[clrInput]" }, { kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { 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: "component", type: i5$1.NgSelectComponent, selector: "ng-select", inputs: ["ariaLabelDropdown", "bindLabel", "bindValue", "ariaLabel", "markFirst", "placeholder", "fixedPlaceholder", "notFoundText", "typeToSearchText", "preventToggleOnRightClick", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "tabFocusOnClearButton", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "ngClass", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd", "deselectOnClick", "keyDownFn"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }, { kind: "component", type: i1.ChipComponent, selector: "vdr-chip", inputs: ["icon", "invert", "colorFrom", "colorType"], outputs: ["iconClick"] }, { kind: "component", type: i1.FormFieldComponent, selector: "vdr-form-field", inputs: ["label", "for", "tooltip", "errors", "readOnlyToggle"], outputs: ["readOnlyToggleChange"] }, { kind: "directive", type: i1.FormFieldControlDirective, selector: "input, textarea, select, vdr-currency-input" }, { kind: "component", type: i1.DataTable2Component, selector: "vdr-data-table-2", inputs: ["id", "items", "itemsPerPage", "currentPage", "totalItems", "emptyStateLabel", "filters", "activeIndex", "trackByPath"], outputs: ["pageChange", "itemsPerPageChange", "visibleColumnsChange"] }, { kind: "component", type: i1.DataTable2ColumnComponent, selector: "vdr-dt2-column", inputs: ["id", "expand", "heading", "align", "sort", "optional", "hiddenByDefault", "orderable"], exportAs: ["row"] }, { kind: "component", type: i1.DataTable2SearchComponent, selector: "vdr-dt2-search", inputs: ["searchTermControl", "searchTermPlaceholder"] }, { kind: "component", type: i1.PageBlockComponent, selector: "vdr-page-block" }, { kind: "component", type: i1.CardComponent, selector: "vdr-card", inputs: ["title", "paddingX"] }, { kind: "component", type: OptionValueInputComponent, selector: "vdr-option-value-input", inputs: ["groupName", "options", "disabled"], outputs: ["add", "remove", "edit"] }, { kind: "pipe", type: i3$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }, { kind: "pipe", type: i1.LocaleDatePipe, name: "localeDate" }, { kind: "pipe", type: i1.LocaleCurrencyPipe, name: "localeCurrency" }], changeDetection: i0.ChangeDetectionStrategy.Default }); }
|
|
987
987
|
}
|
|
988
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
988
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ProductVariantsEditorComponent, decorators: [{
|
|
989
989
|
type: Component,
|
|
990
990
|
args: [{ selector: 'vdr-product-variants-editor', changeDetection: ChangeDetectionStrategy.Default, standalone: false, template: "<vdr-page-block>\n <vdr-card>\n <div *ngFor=\"let group of optionGroups; index as i\" class=\"option-groups\">\n <vdr-form-field [label]=\"'catalog.option' | translate\">\n <input clrInput [(ngModel)]=\"group.name\" name=\"name\" [readonly]=\"!group.isNew\" />\n </vdr-form-field>\n <vdr-form-field [label]=\"'catalog.option-values' | translate\" class=\"flex-spacer\">\n <vdr-option-value-input\n #optionValueInputComponent\n [options]=\"group.values\"\n [groupName]=\"group.name\"\n [disabled]=\"group.name === ''\"\n (add)=\"addOption(i, $event.name)\"\n (remove)=\"removeOption(i, $event)\"\n ></vdr-option-value-input>\n </vdr-form-field>\n <div>\n <button class=\"button-small mt-4\" (click)=\"removeOptionGroup(group)\">\n <clr-icon shape=\"trash\"></clr-icon>\n </button>\n </div>\n </div>\n <button class=\"button mt-1\" (click)=\"addOptionGroup()\">\n <clr-icon shape=\"plus\"></clr-icon>\n {{ 'catalog.create-product-option-group' | translate }}\n </button>\n </vdr-card>\n <vdr-card [paddingX]=\"false\">\n <div class=\"mx-3\">\n <button class=\"button\" (click)=\"createNewVariant()\">\n <clr-icon shape=\"plus\"></clr-icon>\n {{ 'catalog.create-product-variant' | translate }}\n </button>\n </div>\n <vdr-data-table-2\n id=\"manage-product-variant-list\"\n [items]=\"variants$ | async\"\n [itemsPerPage]=\"itemsPerPage\"\n [totalItems]=\"totalItems$ | async\"\n [currentPage]=\"currentPage\"\n (pageChange)=\"setPageNumber($event)\"\n (itemsPerPageChange)=\"setItemsPerPage($event)\"\n >\n <vdr-dt2-search\n [searchTermControl]=\"searchTermControl\"\n [searchTermPlaceholder]=\"'catalog.filter-by-name' | translate\"\n />\n <vdr-dt2-column [heading]=\"'common.id' | translate\" id=\"id\" [hiddenByDefault]=\"true\">\n <ng-template let-variant=\"item\">\n {{ variant.id }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.created-at' | translate\" id=\"created-at\" [hiddenByDefault]=\"true\">\n <ng-template let-variant=\"item\">\n {{ variant.createdAt | localeDate : 'short' }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.updated-at' | translate\" id=\"updated-at\" [hiddenByDefault]=\"true\">\n <ng-template let-variant=\"item\">\n {{ variant.updatedAt | localeDate : 'short' }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'catalog.name' | translate\" id=\"name\" [optional]=\"false\">\n <ng-template let-variant=\"item\">\n {{ variant.name }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'catalog.sku' | translate\" id=\"sku\" [optional]=\"false\">\n <ng-template let-variant=\"item\">\n {{ variant.sku }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column *ngFor=\"let optionGroup of optionGroups$ | async\" [heading]=\"optionGroup.name\" [id]=\"optionGroup.code\">\n <ng-template let-variant=\"item\">\n <vdr-chip\n *ngIf=\"getOption(variant, optionGroup.id) as option; else selectOption\"\n [colorFrom]=\"optionGroup.code\"\n >{{ option.name }}</vdr-chip\n >\n <ng-template #selectOption>\n <div class=\"flex center\">\n <ng-select\n [items]=\"optionGroup.options\"\n bindLabel=\"name\"\n bindValue=\"id\"\n appendTo=\"body\"\n (change)=\"setOptionToAddToVariant(variant.id, optionGroup.id, $event?.id)\"\n ></ng-select>\n <button\n class=\"button-small ml-1\"\n [class.primary]=\"!!optionsToAddToVariant[variant.id]?.[optionGroup.id]\"\n (click)=\"addOptionToVariant(variant)\"\n [disabled]=\"!optionsToAddToVariant[variant.id]?.[optionGroup.id]\"\n >\n <clr-icon shape=\"floppy\"></clr-icon>\n </button>\n </div>\n </ng-template>\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.price' | translate\" id=\"price\" [hiddenByDefault]=\"true\">\n <ng-template let-variant=\"item\">\n {{ variant.price | localeCurrency : variant.currencyCode }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.price-with-tax' | translate\" id=\"price-with-tax\" [hiddenByDefault]=\"true\">\n <ng-template let-variant=\"item\">\n {{ variant.priceWithTax | localeCurrency : variant.currencyCode }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.delete' | translate\" id=\"delete\" [optional]=\"false\">\n <ng-template let-variant=\"item\">\n <button class=\"button-small\" (click)=\"deleteVariant(variant)\">\n <clr-icon shape=\"trash is-danger\"></clr-icon>\n </button>\n </ng-template>\n </vdr-dt2-column>\n </vdr-data-table-2>\n </vdr-card>\n</vdr-page-block>\n", styles: [".option-groups{display:flex;width:100%;gap:var(--space-unit)}.values{flex:1;margin:0 6px}.variants-preview tr.disabled td{background-color:var(--color-component-bg-100);color:var(--color-grey-400)}\n"] }]
|
|
991
991
|
}], ctorParameters: () => [{ type: i1$1.ActivatedRoute }, { type: i1.DataService }, { type: ProductDetailService }, { type: i1.NotificationService }, { type: i1.ModalService }, { type: i0.ChangeDetectorRef }] });
|
|
@@ -1003,10 +1003,10 @@ class ProductVariantsResolver extends BaseEntityResolver {
|
|
|
1003
1003
|
variants: [],
|
|
1004
1004
|
}, id => dataService.product.getProductVariantsOptions(id).mapStream(data => data.product));
|
|
1005
1005
|
}
|
|
1006
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
1007
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.
|
|
1006
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ProductVariantsResolver, deps: [{ token: i1$1.Router }, { token: i1.DataService }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
1007
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ProductVariantsResolver, providedIn: 'root' }); }
|
|
1008
1008
|
}
|
|
1009
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
1009
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ProductVariantsResolver, decorators: [{
|
|
1010
1010
|
type: Injectable,
|
|
1011
1011
|
args: [{
|
|
1012
1012
|
providedIn: 'root',
|
|
@@ -1164,10 +1164,10 @@ class ApplyFacetDialogComponent {
|
|
|
1164
1164
|
cancel() {
|
|
1165
1165
|
this.resolveWith();
|
|
1166
1166
|
}
|
|
1167
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
1168
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
1167
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ApplyFacetDialogComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1168
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: ApplyFacetDialogComponent, isStandalone: false, selector: "vdr-apply-facet-dialog", viewQueries: [{ propertyName: "selector", first: true, predicate: FacetValueSelectorComponent, descendants: true }], ngImport: i0, template: "<ng-template vdrDialogTitle>{{ 'catalog.add-facets' | translate }}</ng-template>\n\n<vdr-facet-value-selector\n (selectedValuesChange)=\"selectedValues = $event\"\n></vdr-facet-value-selector>\n\n<ng-template vdrDialogButtons>\n <button type=\"button\" class=\"btn\" (click)=\"cancel()\">{{ 'common.cancel' | translate }}</button>\n <button\n type=\"submit\"\n (click)=\"selectValues()\"\n [disabled]=\"selectedValues.length === 0\"\n class=\"btn btn-primary\"\n >\n {{ 'catalog.add-facets' | translate }}\n </button>\n</ng-template>\n", styles: [""], dependencies: [{ kind: "component", type: i1.FacetValueSelectorComponent, selector: "vdr-facet-value-selector", inputs: ["readonly", "transformControlValueAccessorValue"], outputs: ["selectedValuesChange"] }, { kind: "directive", type: i1.DialogButtonsDirective, selector: "[vdrDialogButtons]" }, { kind: "directive", type: i1.DialogTitleDirective, selector: "[vdrDialogTitle]" }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1169
1169
|
}
|
|
1170
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
1170
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ApplyFacetDialogComponent, decorators: [{
|
|
1171
1171
|
type: Component,
|
|
1172
1172
|
args: [{ selector: 'vdr-apply-facet-dialog', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<ng-template vdrDialogTitle>{{ 'catalog.add-facets' | translate }}</ng-template>\n\n<vdr-facet-value-selector\n (selectedValuesChange)=\"selectedValues = $event\"\n></vdr-facet-value-selector>\n\n<ng-template vdrDialogButtons>\n <button type=\"button\" class=\"btn\" (click)=\"cancel()\">{{ 'common.cancel' | translate }}</button>\n <button\n type=\"submit\"\n (click)=\"selectValues()\"\n [disabled]=\"selectedValues.length === 0\"\n class=\"btn btn-primary\"\n >\n {{ 'catalog.add-facets' | translate }}\n </button>\n</ng-template>\n" }]
|
|
1173
1173
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { selector: [{
|
|
@@ -1234,10 +1234,10 @@ class AssetDetailComponent extends TypedBaseDetailComponent {
|
|
|
1234
1234
|
this.setCustomFieldFormValues(this.customFields, this.detailForm.get(['customFields']), entity);
|
|
1235
1235
|
}
|
|
1236
1236
|
}
|
|
1237
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
1238
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
1237
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: AssetDetailComponent, deps: [{ token: i1.NotificationService }, { token: i1.DataService }, { token: i2.UntypedFormBuilder }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1238
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: AssetDetailComponent, isStandalone: false, selector: "vdr-asset-detail", usesInheritance: true, ngImport: i0, template: "<vdr-page-block>\n <vdr-action-bar>\n <vdr-ab-left></vdr-ab-left>\n\n <vdr-ab-right>\n <vdr-action-bar-items locationId=\"asset-detail\" />\n <button\n *vdrIfPermissions=\"['UpdateCatalog', 'UpdateAsset']\"\n class=\"btn btn-primary\"\n (click)=\"save()\"\n [disabled]=\"detailForm.invalid || detailForm.pristine\"\n >\n {{ 'common.update' | translate }}\n </button>\n <vdr-action-bar-dropdown-menu locationId=\"asset-detail\" />\n </vdr-ab-right>\n </vdr-action-bar>\n</vdr-page-block>\n<vdr-page-block>\n <vdr-asset-preview\n [asset]=\"entity$ | async\"\n [editable]=\"true\"\n [customFields]=\"customFields\"\n [customFieldsForm]=\"detailForm.get('customFields')\"\n (assetChange)=\"onAssetChange($event)\"\n />\n</vdr-page-block>\n", styles: [":host{display:flex;flex-direction:column;height:100%}\n"], dependencies: [{ kind: "component", type: i1.ActionBarComponent, selector: "vdr-action-bar" }, { kind: "component", type: i1.ActionBarLeftComponent, selector: "vdr-ab-left", inputs: ["grow"] }, { kind: "component", type: i1.ActionBarRightComponent, selector: "vdr-ab-right", inputs: ["grow"] }, { kind: "component", type: i1.ActionBarDropdownMenuComponent, selector: "vdr-action-bar-dropdown-menu", inputs: ["alwaysShow"] }, { kind: "component", type: i1.AssetPreviewComponent, selector: "vdr-asset-preview", inputs: ["asset", "assets", "editable", "customFields", "customFieldsForm"], outputs: ["assetChange", "editClick"] }, { kind: "directive", type: i1.IfPermissionsDirective, selector: "[vdrIfPermissions]", inputs: ["vdrIfPermissions", "vdrIfPermissionsElse"] }, { kind: "component", type: i1.ActionBarItemsComponent, selector: "vdr-action-bar-items" }, { kind: "component", type: i1.PageBlockComponent, selector: "vdr-page-block" }, { kind: "pipe", type: i3$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1239
1239
|
}
|
|
1240
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
1240
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: AssetDetailComponent, decorators: [{
|
|
1241
1241
|
type: Component,
|
|
1242
1242
|
args: [{ selector: 'vdr-asset-detail', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<vdr-page-block>\n <vdr-action-bar>\n <vdr-ab-left></vdr-ab-left>\n\n <vdr-ab-right>\n <vdr-action-bar-items locationId=\"asset-detail\" />\n <button\n *vdrIfPermissions=\"['UpdateCatalog', 'UpdateAsset']\"\n class=\"btn btn-primary\"\n (click)=\"save()\"\n [disabled]=\"detailForm.invalid || detailForm.pristine\"\n >\n {{ 'common.update' | translate }}\n </button>\n <vdr-action-bar-dropdown-menu locationId=\"asset-detail\" />\n </vdr-ab-right>\n </vdr-action-bar>\n</vdr-page-block>\n<vdr-page-block>\n <vdr-asset-preview\n [asset]=\"entity$ | async\"\n [editable]=\"true\"\n [customFields]=\"customFields\"\n [customFieldsForm]=\"detailForm.get('customFields')\"\n (assetChange)=\"onAssetChange($event)\"\n />\n</vdr-page-block>\n", styles: [":host{display:flex;flex-direction:column;height:100%}\n"] }]
|
|
1243
1243
|
}], ctorParameters: () => [{ type: i1.NotificationService }, { type: i1.DataService }, { type: i2.UntypedFormBuilder }] });
|
|
@@ -1344,10 +1344,10 @@ class AssetListComponent extends BaseListComponent {
|
|
|
1344
1344
|
})
|
|
1345
1345
|
.pipe(switchMap(res => (res ? this.dataService.product.deleteAssets(assetIds, !!message) : EMPTY)), map(res => res.deleteAssets));
|
|
1346
1346
|
}
|
|
1347
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
1348
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
1347
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: AssetListComponent, deps: [{ token: i1.NotificationService }, { token: i1.ModalService }, { token: i1.DataService }, { token: i1$1.Router }, { token: i1$1.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1348
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: AssetListComponent, isStandalone: false, selector: "vdr-asset-list", usesInheritance: true, ngImport: i0, template: "<vdr-page-block>\n <div class=\"my-2\">\n <vdr-asset-search-input\n [tags]=\"allTags$ | async\"\n (searchTermChange)=\"searchTerm$.next($event)\"\n (tagsChange)=\"filterByTags$.next($event)\"\n >\n <vdr-asset-file-input\n (selectFiles)=\"filesSelected($event)\"\n [uploading]=\"uploading\"\n dropZoneTarget=\".content-area\"\n ></vdr-asset-file-input>\n </vdr-asset-search-input>\n </div>\n <vdr-asset-gallery\n [assets]=\"(items$ | async)! | paginate : (paginationConfig$ | async) || {}\"\n [multiSelect]=\"true\"\n [canDelete]=\"['DeleteCatalog', 'DeleteAsset'] | hasPermission\"\n (deleteAssets)=\"deleteAssets($event)\"\n ></vdr-asset-gallery>\n\n <div class=\"paging-controls\">\n <vdr-items-per-page-controls\n [itemsPerPage]=\"itemsPerPage$ | async\"\n (itemsPerPageChange)=\"setItemsPerPage($event)\"\n ></vdr-items-per-page-controls>\n\n <vdr-pagination-controls\n [currentPage]=\"currentPage$ | async\"\n [itemsPerPage]=\"itemsPerPage$ | async\"\n [totalItems]=\"totalItems$ | async\"\n (pageChange)=\"setPageNumber($event)\"\n ></vdr-pagination-controls>\n </div>\n</vdr-page-block>\n", styles: [":host{display:flex;flex-direction:column;height:100%}vdr-asset-gallery{flex:1}.paging-controls{padding-top:6px;border-top:1px solid var(--color-component-border-100);display:flex;justify-content:space-between}.search-input{margin-top:6px;min-width:300px}\n"], dependencies: [{ kind: "component", type: i1.AssetSearchInputComponent, selector: "vdr-asset-search-input", inputs: ["tags"], outputs: ["searchTermChange", "tagsChange"] }, { kind: "component", type: i1.ItemsPerPageControlsComponent, selector: "vdr-items-per-page-controls", inputs: ["itemsPerPage"], outputs: ["itemsPerPageChange"] }, { kind: "component", type: i1.PaginationControlsComponent, selector: "vdr-pagination-controls", inputs: ["id", "currentPage", "itemsPerPage", "totalItems"], outputs: ["pageChange"] }, { kind: "component", type: i1.AssetFileInputComponent, selector: "vdr-asset-file-input", inputs: ["dropZoneTarget", "uploading"], outputs: ["selectFiles"] }, { kind: "component", type: i1.AssetGalleryComponent, selector: "vdr-asset-gallery", inputs: ["assets", "multiSelect", "canDelete"], outputs: ["selectionChange", "deleteAssets", "editAssetClick"] }, { kind: "component", type: i1.PageBlockComponent, selector: "vdr-page-block" }, { kind: "pipe", type: i3$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i5$2.PaginatePipe, name: "paginate" }, { kind: "pipe", type: i1.HasPermissionPipe, name: "hasPermission" }] }); }
|
|
1349
1349
|
}
|
|
1350
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
1350
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: AssetListComponent, decorators: [{
|
|
1351
1351
|
type: Component,
|
|
1352
1352
|
args: [{ selector: 'vdr-asset-list', standalone: false, template: "<vdr-page-block>\n <div class=\"my-2\">\n <vdr-asset-search-input\n [tags]=\"allTags$ | async\"\n (searchTermChange)=\"searchTerm$.next($event)\"\n (tagsChange)=\"filterByTags$.next($event)\"\n >\n <vdr-asset-file-input\n (selectFiles)=\"filesSelected($event)\"\n [uploading]=\"uploading\"\n dropZoneTarget=\".content-area\"\n ></vdr-asset-file-input>\n </vdr-asset-search-input>\n </div>\n <vdr-asset-gallery\n [assets]=\"(items$ | async)! | paginate : (paginationConfig$ | async) || {}\"\n [multiSelect]=\"true\"\n [canDelete]=\"['DeleteCatalog', 'DeleteAsset'] | hasPermission\"\n (deleteAssets)=\"deleteAssets($event)\"\n ></vdr-asset-gallery>\n\n <div class=\"paging-controls\">\n <vdr-items-per-page-controls\n [itemsPerPage]=\"itemsPerPage$ | async\"\n (itemsPerPageChange)=\"setItemsPerPage($event)\"\n ></vdr-items-per-page-controls>\n\n <vdr-pagination-controls\n [currentPage]=\"currentPage$ | async\"\n [itemsPerPage]=\"itemsPerPage$ | async\"\n [totalItems]=\"totalItems$ | async\"\n (pageChange)=\"setPageNumber($event)\"\n ></vdr-pagination-controls>\n </div>\n</vdr-page-block>\n", styles: [":host{display:flex;flex-direction:column;height:100%}vdr-asset-gallery{flex:1}.paging-controls{padding-top:6px;border-top:1px solid var(--color-component-border-100);display:flex;justify-content:space-between}.search-input{margin-top:6px;min-width:300px}\n"] }]
|
|
1353
1353
|
}], ctorParameters: () => [{ type: i1.NotificationService }, { type: i1.ModalService }, { type: i1.DataService }, { type: i1$1.Router }, { type: i1$1.ActivatedRoute }] });
|
|
@@ -1434,10 +1434,10 @@ class AssignProductsToChannelDialogComponent {
|
|
|
1434
1434
|
take,
|
|
1435
1435
|
}).single$)).productVariants.items;
|
|
1436
1436
|
}
|
|
1437
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
1438
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
1437
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: AssignProductsToChannelDialogComponent, deps: [{ token: i1.DataService }, { token: i1.NotificationService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1438
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: AssignProductsToChannelDialogComponent, isStandalone: false, selector: "vdr-assign-products-to-channel-dialog", ngImport: i0, template: "<ng-template vdrDialogTitle>\n <ng-container *ngIf=\"isProductVariantMode; else productModeTitle\">{{\n 'catalog.assign-variants-to-channel' | translate\n }}</ng-container>\n <ng-template #productModeTitle>{{ 'catalog.assign-products-to-channel' | translate }}</ng-template>\n</ng-template>\n\n<div class=\"flex\">\n <clr-input-container>\n <label>{{ 'common.channel' | translate }}</label>\n <vdr-channel-assignment-control\n clrInput\n [multiple]=\"false\"\n [includeDefaultChannel]=\"false\"\n [disableChannelIds]=\"currentChannelIds\"\n [formControl]=\"selectedChannelIdControl\"\n ></vdr-channel-assignment-control>\n </clr-input-container>\n <div class=\"flex-spacer\"></div>\n <clr-input-container>\n <label>{{ 'catalog.price-conversion-factor' | translate }}</label>\n <input clrInput type=\"number\" min=\"0\" max=\"99999\" [formControl]=\"priceFactorControl\" />\n </clr-input-container>\n</div>\n\n<div class=\"channel-price-preview\">\n <label class=\"clr-control-label\">{{ 'catalog.channel-price-preview' | translate }}</label>\n <table class=\"table\">\n <thead>\n <tr>\n <th>{{ 'common.name' | translate }}</th>\n <th>\n {{\n 'catalog.price-in-channel'\n | translate: { channel: currentChannel?.code | channelCodeToLabel | translate }\n }}\n </th>\n <th>\n <ng-template [ngIf]=\"selectedChannel\" [ngIfElse]=\"noSelection\">\n {{ 'catalog.price-in-channel' | translate: { channel: selectedChannel?.code } }}\n </ng-template>\n <ng-template #noSelection>\n {{ 'catalog.no-channel-selected' | translate }}\n </ng-template>\n </th>\n </tr>\n </thead>\n <tbody>\n <tr *ngFor=\"let row of variantsPreview$ | async\">\n <td>{{ row.name }}</td>\n <td>{{ row.price | localeCurrency: currentChannel?.defaultCurrencyCode }}</td>\n <td>\n <ng-template [ngIf]=\"selectedChannel\" [ngIfElse]=\"noChannelSelected\">\n {{ row.pricePreview | localeCurrency: selectedChannel?.defaultCurrencyCode }}\n </ng-template>\n <ng-template #noChannelSelected> - </ng-template>\n </td>\n </tr>\n </tbody>\n </table>\n</div>\n\n<ng-template vdrDialogButtons>\n <button type=\"button\" class=\"btn\" (click)=\"cancel()\">{{ 'common.cancel' | translate }}</button>\n <button type=\"submit\" (click)=\"assign()\" [disabled]=\"!selectedChannel\" class=\"btn btn-primary\">\n <ng-template [ngIf]=\"selectedChannel\" [ngIfElse]=\"noSelection\">\n {{ 'catalog.assign-to-named-channel' | translate: { channelCode: selectedChannel?.code } }}\n </ng-template>\n <ng-template #noSelection>\n {{ 'catalog.no-channel-selected' | translate }}\n </ng-template>\n </button>\n</ng-template>\n", styles: ["vdr-channel-assignment-control{min-width:200px}.channel-price-preview{margin-top:24px}.channel-price-preview table.table{margin-top:6px}\n"], dependencies: [{ kind: "directive", type: i3.ClrLabel, selector: "label", inputs: ["id", "for"] }, { kind: "directive", type: i3.ClrInput, selector: "[clrInput]" }, { kind: "component", type: i3.ClrInputContainer, selector: "clr-input-container" }, { kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { 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.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i2.MaxValidator, selector: "input[type=number][max][formControlName],input[type=number][max][formControl],input[type=number][max][ngModel]", inputs: ["max"] }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormFieldControlDirective, selector: "input, textarea, select, vdr-currency-input" }, { kind: "directive", type: i1.DialogButtonsDirective, selector: "[vdrDialogButtons]" }, { kind: "directive", type: i1.DialogTitleDirective, selector: "[vdrDialogTitle]" }, { kind: "component", type: i1.ChannelAssignmentControlComponent, selector: "vdr-channel-assignment-control", inputs: ["multiple", "includeDefaultChannel", "disableChannelIds"] }, { kind: "pipe", type: i3$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }, { kind: "pipe", type: i1.ChannelLabelPipe, name: "channelCodeToLabel" }, { kind: "pipe", type: i1.LocaleCurrencyPipe, name: "localeCurrency" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1439
1439
|
}
|
|
1440
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
1440
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: AssignProductsToChannelDialogComponent, decorators: [{
|
|
1441
1441
|
type: Component,
|
|
1442
1442
|
args: [{ selector: 'vdr-assign-products-to-channel-dialog', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<ng-template vdrDialogTitle>\n <ng-container *ngIf=\"isProductVariantMode; else productModeTitle\">{{\n 'catalog.assign-variants-to-channel' | translate\n }}</ng-container>\n <ng-template #productModeTitle>{{ 'catalog.assign-products-to-channel' | translate }}</ng-template>\n</ng-template>\n\n<div class=\"flex\">\n <clr-input-container>\n <label>{{ 'common.channel' | translate }}</label>\n <vdr-channel-assignment-control\n clrInput\n [multiple]=\"false\"\n [includeDefaultChannel]=\"false\"\n [disableChannelIds]=\"currentChannelIds\"\n [formControl]=\"selectedChannelIdControl\"\n ></vdr-channel-assignment-control>\n </clr-input-container>\n <div class=\"flex-spacer\"></div>\n <clr-input-container>\n <label>{{ 'catalog.price-conversion-factor' | translate }}</label>\n <input clrInput type=\"number\" min=\"0\" max=\"99999\" [formControl]=\"priceFactorControl\" />\n </clr-input-container>\n</div>\n\n<div class=\"channel-price-preview\">\n <label class=\"clr-control-label\">{{ 'catalog.channel-price-preview' | translate }}</label>\n <table class=\"table\">\n <thead>\n <tr>\n <th>{{ 'common.name' | translate }}</th>\n <th>\n {{\n 'catalog.price-in-channel'\n | translate: { channel: currentChannel?.code | channelCodeToLabel | translate }\n }}\n </th>\n <th>\n <ng-template [ngIf]=\"selectedChannel\" [ngIfElse]=\"noSelection\">\n {{ 'catalog.price-in-channel' | translate: { channel: selectedChannel?.code } }}\n </ng-template>\n <ng-template #noSelection>\n {{ 'catalog.no-channel-selected' | translate }}\n </ng-template>\n </th>\n </tr>\n </thead>\n <tbody>\n <tr *ngFor=\"let row of variantsPreview$ | async\">\n <td>{{ row.name }}</td>\n <td>{{ row.price | localeCurrency: currentChannel?.defaultCurrencyCode }}</td>\n <td>\n <ng-template [ngIf]=\"selectedChannel\" [ngIfElse]=\"noChannelSelected\">\n {{ row.pricePreview | localeCurrency: selectedChannel?.defaultCurrencyCode }}\n </ng-template>\n <ng-template #noChannelSelected> - </ng-template>\n </td>\n </tr>\n </tbody>\n </table>\n</div>\n\n<ng-template vdrDialogButtons>\n <button type=\"button\" class=\"btn\" (click)=\"cancel()\">{{ 'common.cancel' | translate }}</button>\n <button type=\"submit\" (click)=\"assign()\" [disabled]=\"!selectedChannel\" class=\"btn btn-primary\">\n <ng-template [ngIf]=\"selectedChannel\" [ngIfElse]=\"noSelection\">\n {{ 'catalog.assign-to-named-channel' | translate: { channelCode: selectedChannel?.code } }}\n </ng-template>\n <ng-template #noSelection>\n {{ 'catalog.no-channel-selected' | translate }}\n </ng-template>\n </button>\n</ng-template>\n", styles: ["vdr-channel-assignment-control{min-width:200px}.channel-price-preview{margin-top:24px}.channel-price-preview table.table{margin-top:6px}\n"] }]
|
|
1443
1443
|
}], ctorParameters: () => [{ type: i1.DataService }, { type: i1.NotificationService }] });
|
|
@@ -1577,10 +1577,10 @@ class BulkAddFacetValuesDialogComponent {
|
|
|
1577
1577
|
this.resolveWith(this.selectedValues);
|
|
1578
1578
|
});
|
|
1579
1579
|
}
|
|
1580
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
1581
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
1580
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: BulkAddFacetValuesDialogComponent, deps: [{ token: i1.DataService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1581
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: BulkAddFacetValuesDialogComponent, isStandalone: false, selector: "vdr-bulk-add-facet-values-dialog", ngImport: i0, template: "<ng-template vdrDialogTitle>\n {{ 'catalog.edit-facet-values' | translate }}\n</ng-template>\n\n<div class=\"flex\">\n <div class=\"flex center\">\n <div class=\"mr2\">\n {{ 'catalog.add-facet-value' | translate }}\n </div>\n <vdr-facet-value-selector\n (selectedValuesChange)=\"selectedValues = $event\"\n ></vdr-facet-value-selector>\n </div>\n</div>\n\n<table class=\"table\" *ngIf=\"state !== 'loading'; else placeholder\">\n <tbody>\n <tr *ngFor=\"let item of items\">\n <td class=\"left align-middle\">\n <div>{{ item.name }}</div>\n <div *ngIf=\"item.sku\" class=\"sku\">{{ item.sku }}</div>\n </td>\n <td class=\"left\">\n <vdr-facet-value-chip\n *ngFor=\"let facetValue of item.facetValues\"\n [facetValue]=\"facetValue\"\n (remove)=\"removeFacetValue(item, facetValue.id)\"\n ></vdr-facet-value-chip>\n </td>\n </tr>\n </tbody>\n</table>\n\n<ng-template #placeholder>\n <div class=\"loading\">\n <clr-spinner></clr-spinner>\n </div>\n</ng-template>\n\n<ng-template vdrDialogButtons>\n <button type=\"button\" class=\"btn\" (click)=\"cancel()\">{{ 'common.cancel' | translate }}</button>\n <button\n type=\"submit\"\n (click)=\"addFacetValues()\"\n [disabled]=\"selectedValues.length === 0 && facetValuesRemoved === false\"\n class=\"btn btn-primary\"\n >\n {{ 'common.update' | translate }}\n </button>\n</ng-template>\n", styles: [".loading{min-height:25vh;display:flex;justify-content:center;align-items:center}.sku{color:var(--color-text-300)}\n"], dependencies: [{ kind: "component", type: i3.ClrSpinner, selector: "clr-spinner", inputs: ["clrInline", "clrInverse", "clrSmall", "clrMedium"] }, { kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i1.FacetValueSelectorComponent, selector: "vdr-facet-value-selector", inputs: ["readonly", "transformControlValueAccessorValue"], outputs: ["selectedValuesChange"] }, { kind: "component", type: i1.FacetValueChipComponent, selector: "vdr-facet-value-chip", inputs: ["facetValue", "removable", "displayFacetName"], outputs: ["remove"] }, { kind: "directive", type: i1.DialogButtonsDirective, selector: "[vdrDialogButtons]" }, { kind: "directive", type: i1.DialogTitleDirective, selector: "[vdrDialogTitle]" }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1582
1582
|
}
|
|
1583
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
1583
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: BulkAddFacetValuesDialogComponent, decorators: [{
|
|
1584
1584
|
type: Component,
|
|
1585
1585
|
args: [{ selector: 'vdr-bulk-add-facet-values-dialog', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<ng-template vdrDialogTitle>\n {{ 'catalog.edit-facet-values' | translate }}\n</ng-template>\n\n<div class=\"flex\">\n <div class=\"flex center\">\n <div class=\"mr2\">\n {{ 'catalog.add-facet-value' | translate }}\n </div>\n <vdr-facet-value-selector\n (selectedValuesChange)=\"selectedValues = $event\"\n ></vdr-facet-value-selector>\n </div>\n</div>\n\n<table class=\"table\" *ngIf=\"state !== 'loading'; else placeholder\">\n <tbody>\n <tr *ngFor=\"let item of items\">\n <td class=\"left align-middle\">\n <div>{{ item.name }}</div>\n <div *ngIf=\"item.sku\" class=\"sku\">{{ item.sku }}</div>\n </td>\n <td class=\"left\">\n <vdr-facet-value-chip\n *ngFor=\"let facetValue of item.facetValues\"\n [facetValue]=\"facetValue\"\n (remove)=\"removeFacetValue(item, facetValue.id)\"\n ></vdr-facet-value-chip>\n </td>\n </tr>\n </tbody>\n</table>\n\n<ng-template #placeholder>\n <div class=\"loading\">\n <clr-spinner></clr-spinner>\n </div>\n</ng-template>\n\n<ng-template vdrDialogButtons>\n <button type=\"button\" class=\"btn\" (click)=\"cancel()\">{{ 'common.cancel' | translate }}</button>\n <button\n type=\"submit\"\n (click)=\"addFacetValues()\"\n [disabled]=\"selectedValues.length === 0 && facetValuesRemoved === false\"\n class=\"btn btn-primary\"\n >\n {{ 'common.update' | translate }}\n </button>\n</ng-template>\n", styles: [".loading{min-height:25vh;display:flex;justify-content:center;align-items:center}.sku{color:var(--color-text-300)}\n"] }]
|
|
1586
1586
|
}], ctorParameters: () => [{ type: i1.DataService }, { type: i0.ChangeDetectorRef }] });
|
|
@@ -1678,10 +1678,10 @@ class CollectionContentsComponent {
|
|
|
1678
1678
|
replaceUrl: true,
|
|
1679
1679
|
});
|
|
1680
1680
|
}
|
|
1681
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
1682
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
1681
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: CollectionContentsComponent, deps: [{ token: i1$1.ActivatedRoute }, { token: i1$1.Router }, { token: i1.DataService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1682
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: CollectionContentsComponent, isStandalone: false, selector: "vdr-collection-contents", inputs: { collectionId: "collectionId", parentId: "parentId", inheritFilters: "inheritFilters", updatedFilters: "updatedFilters", previewUpdatedFilters: "previewUpdatedFilters" }, queries: [{ propertyName: "headerTemplate", first: true, predicate: TemplateRef, descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"table-wrapper\">\n <div class=\"progress loop\" [class.visible]=\"isLoading\"></div>\n <div class=\"header-title-row\">\n <ng-container\n *ngTemplateOutlet=\"headerTemplate; context: { $implicit: contentsTotalItems$ | async }\"\n ></ng-container>\n </div>\n <vdr-data-table-2\n id=\"collection-contents\"\n [class.loading]=\"isLoading\"\n [items]=\"contents$ | async\"\n [itemsPerPage]=\"contentsItemsPerPage$ | async\"\n [totalItems]=\"contentsTotalItems$ | async\"\n [currentPage]=\"contentsCurrentPage$ | async\"\n (pageChange)=\"setContentsPageNumber($event)\"\n (itemsPerPageChange)=\"setContentsItemsPerPage($event)\"\n >\n <vdr-dt2-search\n [searchTermControl]=\"filterTermControl\"\n [searchTermPlaceholder]=\"'catalog.filter-by-name' | translate\"\n />\n <vdr-dt2-column [heading]=\"'common.id' | translate\" id=\"id\" [hiddenByDefault]=\"true\">\n <ng-template let-variant=\"item\">\n {{ variant.id }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.created-at' | translate\" id=\"created-at\" [hiddenByDefault]=\"true\">\n <ng-template let-variant=\"item\">\n {{ variant.createdAt | localeDate : 'short' }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.updated-at' | translate\" id=\"updated-at\" [hiddenByDefault]=\"true\">\n <ng-template let-variant=\"item\">\n {{ variant.updatedAt | localeDate : 'short' }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.name' | translate\" id=\"name\" [optional]=\"false\">\n <ng-template let-variant=\"item\">\n <a class=\"button-ghost\" [routerLink]=\"['/catalog/products', variant.productId]\"\n ><span>{{ variant.name }}</span\n ><clr-icon shape=\"arrow right\"\n /></a>\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'catalog.sku' | translate\" id=\"sku\" [optional]=\"false\">\n <ng-template let-variant=\"item\">\n {{ variant.sku }}\n </ng-template>\n </vdr-dt2-column>\n </vdr-data-table-2>\n</div>\n", styles: [":host{display:block}:host ::ng-deep table{margin-top:-1px}vdr-data-table{opacity:1;transition:opacity .3s}vdr-data-table.loading{opacity:.5}.table-wrapper{position:relative}.progress{position:absolute;top:0;left:0;overflow:hidden;height:6px;opacity:0;transition:opacity .1s}.progress.visible{opacity:1}.sku{color:var(--color-text-200)}\n"], dependencies: [{ kind: "directive", type: i3.ClrIconCustomTag, selector: "clr-icon" }, { kind: "directive", type: i3$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i1.DataTable2Component, selector: "vdr-data-table-2", inputs: ["id", "items", "itemsPerPage", "currentPage", "totalItems", "emptyStateLabel", "filters", "activeIndex", "trackByPath"], outputs: ["pageChange", "itemsPerPageChange", "visibleColumnsChange"] }, { kind: "component", type: i1.DataTable2ColumnComponent, selector: "vdr-dt2-column", inputs: ["id", "expand", "heading", "align", "sort", "optional", "hiddenByDefault", "orderable"], exportAs: ["row"] }, { kind: "component", type: i1.DataTable2SearchComponent, selector: "vdr-dt2-search", inputs: ["searchTermControl", "searchTermPlaceholder"] }, { kind: "pipe", type: i3$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }, { kind: "pipe", type: i1.LocaleDatePipe, name: "localeDate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1683
1683
|
}
|
|
1684
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
1684
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: CollectionContentsComponent, decorators: [{
|
|
1685
1685
|
type: Component,
|
|
1686
1686
|
args: [{ selector: 'vdr-collection-contents', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<div class=\"table-wrapper\">\n <div class=\"progress loop\" [class.visible]=\"isLoading\"></div>\n <div class=\"header-title-row\">\n <ng-container\n *ngTemplateOutlet=\"headerTemplate; context: { $implicit: contentsTotalItems$ | async }\"\n ></ng-container>\n </div>\n <vdr-data-table-2\n id=\"collection-contents\"\n [class.loading]=\"isLoading\"\n [items]=\"contents$ | async\"\n [itemsPerPage]=\"contentsItemsPerPage$ | async\"\n [totalItems]=\"contentsTotalItems$ | async\"\n [currentPage]=\"contentsCurrentPage$ | async\"\n (pageChange)=\"setContentsPageNumber($event)\"\n (itemsPerPageChange)=\"setContentsItemsPerPage($event)\"\n >\n <vdr-dt2-search\n [searchTermControl]=\"filterTermControl\"\n [searchTermPlaceholder]=\"'catalog.filter-by-name' | translate\"\n />\n <vdr-dt2-column [heading]=\"'common.id' | translate\" id=\"id\" [hiddenByDefault]=\"true\">\n <ng-template let-variant=\"item\">\n {{ variant.id }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.created-at' | translate\" id=\"created-at\" [hiddenByDefault]=\"true\">\n <ng-template let-variant=\"item\">\n {{ variant.createdAt | localeDate : 'short' }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.updated-at' | translate\" id=\"updated-at\" [hiddenByDefault]=\"true\">\n <ng-template let-variant=\"item\">\n {{ variant.updatedAt | localeDate : 'short' }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.name' | translate\" id=\"name\" [optional]=\"false\">\n <ng-template let-variant=\"item\">\n <a class=\"button-ghost\" [routerLink]=\"['/catalog/products', variant.productId]\"\n ><span>{{ variant.name }}</span\n ><clr-icon shape=\"arrow right\"\n /></a>\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'catalog.sku' | translate\" id=\"sku\" [optional]=\"false\">\n <ng-template let-variant=\"item\">\n {{ variant.sku }}\n </ng-template>\n </vdr-dt2-column>\n </vdr-data-table-2>\n</div>\n", styles: [":host{display:block}:host ::ng-deep table{margin-top:-1px}vdr-data-table{opacity:1;transition:opacity .3s}vdr-data-table.loading{opacity:.5}.table-wrapper{position:relative}.progress{position:absolute;top:0;left:0;overflow:hidden;height:6px;opacity:0;transition:opacity .1s}.progress.visible{opacity:1}.sku{color:var(--color-text-200)}\n"] }]
|
|
1687
1687
|
}], ctorParameters: () => [{ type: i1$1.ActivatedRoute }, { type: i1$1.Router }, { type: i1.DataService }], propDecorators: { collectionId: [{
|
|
@@ -1764,10 +1764,10 @@ class CollectionDataTableComponent extends DataTable2Component {
|
|
|
1764
1764
|
}
|
|
1765
1765
|
this.changeDetectorRef.markForCheck();
|
|
1766
1766
|
}
|
|
1767
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
1768
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: CollectionDataTableComponent, isStandalone: false, selector: "vdr-collection-data-table", inputs: { subCollections: "subCollections" }, outputs: { changeOrder: "changeOrder" }, viewQueries: [{ propertyName: "dropList", first: true, predicate: CdkDropList, descendants: true, static: true }, { propertyName: "collectionRowList", predicate: ["collectionRow"], descendants: true, read: CdkDrag }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<vdr-data-table-filter-presets\n *ngIf=\"filters\"\n [filters]=\"filters\"\n [dataTableId]=\"id\"\n></vdr-data-table-filter-presets>\n<div class=\"table-wrapper\">\n <div class=\"bulk-actions\">\n <ng-content select=\"vdr-bulk-action-menu\"></ng-content>\n </div>\n <table class=\"\" [class.no-select]=\"disableSelect\">\n <thead [class.items-selected]=\"selectionManager?.selection.length\">\n <tr class=\"heading-row\">\n <th *ngIf=\"selectionManager\" class=\"selection-col\">\n <div class=\"flex\">\n <div class=\"drag-handle-spacer\"></div>\n <input\n type=\"checkbox\"\n clrCheckbox\n [checked]=\"selectionManager?.areAllCurrentItemsSelected()\"\n (change)=\"onToggleAllClick()\"\n />\n </div>\n </th>\n <th\n *ngFor=\"let column of visibleSortedColumns; last as isLast\"\n [class.expand]=\"column.expand\"\n >\n <div class=\"cell-content\" [ngClass]=\"column.align\">\n <vdr-ui-extension-point\n [locationId]=\"id\"\n [metadata]=\"column.id\"\n api=\"dataTable\"\n [topPx]=\"-6\"\n [leftPx]=\"-24\"\n display=\"block\"\n >\n <span>{{ column.heading }}</span>\n </vdr-ui-extension-point>\n <div *ngIf=\"column.sort as sort\" class=\"sort-toggle\">\n <button (click)=\"sort.toggleSortOrder()\" [class.active]=\"sort.sortOrder\">\n <clr-icon *ngIf=\"!sort.sortOrder\" shape=\"two-way-arrows left\"></clr-icon>\n <clr-icon *ngIf=\"sort.sortOrder === 'ASC'\" shape=\"arrow up\"></clr-icon>\n <clr-icon *ngIf=\"sort.sortOrder === 'DESC'\" shape=\"arrow down\"></clr-icon>\n </button>\n <div class=\"sort-label\" *ngIf=\"sort.sortOrder\">{{ sort.sortOrder }}</div>\n </div>\n </div>\n </th>\n <th>\n <div class=\"column-picker\">\n <vdr-data-table-colum-picker\n [uiLanguage]=\"uiLanguage$ | async\"\n [columns]=\"sortedColumns\"\n (reorder)=\"onColumnReorder($event)\"\n (resetColumns)=\"onColumnsReset()\"\n ></vdr-data-table-colum-picker>\n </div>\n </th>\n </tr>\n <tr *ngIf=\"searchComponent || customSearchTemplate || filters?.length\">\n <th\n [attr.colspan]=\"visibleSortedColumns.length + (selectionManager ? 2 : 1)\"\n class=\"filter-row\"\n [class.active]=\"showSearchFilterRow\"\n >\n <button\n class=\"button-ghost toggle-search-filter-row\"\n [class.active]=\"showSearchFilterRow\"\n (click)=\"toggleSearchFilterRow()\"\n [title]=\"'common.search-and-filter-list' | translate\"\n >\n <clr-icon shape=\"search\"></clr-icon>\n </button>\n <div class=\"filter-row-wrapper\" [class.hidden]=\"!showSearchFilterRow\">\n <ng-container *ngTemplateOutlet=\"searchComponent?.template\"></ng-container>\n <ng-container *ngTemplateOutlet=\"customSearchTemplate\"></ng-container>\n <ng-container *ngIf=\"filters\">\n <div class=\"filters\">\n <vdr-data-table-filters\n *ngFor=\"let activeFilter of filters.activeFilters\"\n [filterWithValue]=\"activeFilter\"\n [filters]=\"filters\"\n class=\"mt-1\"\n ></vdr-data-table-filters>\n <vdr-data-table-filters\n *ngIf=\"filters.length\"\n [filters]=\"filters\"\n class=\"mt-1\"\n ></vdr-data-table-filters>\n <vdr-add-filter-preset-button\n [filters]=\"filters\"\n [dataTableId]=\"id\"\n ></vdr-add-filter-preset-button>\n </div>\n </ng-container>\n </div>\n </th>\n </tr>\n </thead>\n <tbody\n cdkDropList\n cdkDropListLockAxis=\"y\"\n (cdkDropListDropped)=\"onDrop($event)\"\n [cdkDropListSortPredicate]=\"sortPredicate\"\n >\n <ng-container\n *ngFor=\"\n let item of items\n | paginate\n : {\n itemsPerPage: itemsPerPage,\n currentPage: currentPage,\n totalItems: totalItems,\n id: id,\n };\n index as i;\n trackBy: trackByFn.bind(this)\n \"\n >\n <ng-container\n [ngTemplateOutlet]=\"collectionRowTmp\"\n [ngTemplateOutletContext]=\"{ item: item, i: i, depth: 0 }\"\n ></ng-container>\n </ng-container>\n <ng-container>\n <tr *ngIf=\"!items?.length\">\n <td [attr.colspan]=\"visibleSortedColumns.length + (selectionManager ? 2 : 1)\">\n <vdr-empty-placeholder [emptyStateLabel]=\"emptyStateLabel\"></vdr-empty-placeholder>\n </td>\n </tr>\n </ng-container>\n </tbody>\n </table>\n</div>\n<div class=\"table-footer\">\n <vdr-items-per-page-controls\n *ngIf=\"totalItems\"\n [itemsPerPage]=\"itemsPerPage\"\n (itemsPerPageChange)=\"itemsPerPageChange.emit($event)\"\n ></vdr-items-per-page-controls>\n <div *ngIf=\"totalItems\" class=\"p5 total-items-count\">\n {{ 'common.total-items' | translate : { currentStart, currentEnd, totalItems } }}\n </div>\n\n <vdr-pagination-controls\n *ngIf=\"totalItems\"\n [id]=\"id\"\n [currentPage]=\"currentPage\"\n [itemsPerPage]=\"itemsPerPage\"\n [totalItems]=\"totalItems\"\n (pageChange)=\"pageChange.emit($event)\"\n ></vdr-pagination-controls>\n</div>\n\n<ng-template #collectionRowTmp let-item=\"item\" let-depth=\"depth\">\n <tr #collectionRow cdkDrag [cdkDragData]=\"{ depth: depth, collection: item }\" cdkDragBoundary=\"tbody\">\n <td\n *ngIf=\"selectionManager\"\n [class.active]=\"activeIndex === absoluteIndex[item.id]\"\n class=\"selection-col\"\n >\n <div class=\"flex\">\n <div class=\"drag-handle\" cdkDragHandle [title]=\"'catalog.reorder-collection' | translate\">\n <clr-icon shape=\"drag-handle\"></clr-icon>\n </div>\n <input\n type=\"checkbox\"\n clrCheckbox\n [checked]=\"selectionManager?.isSelected(item)\"\n (click)=\"onRowClick(item, $event)\"\n />\n </div>\n </td>\n <td\n *ngFor=\"let column of visibleSortedColumns\"\n [class.active]=\"activeIndex === absoluteIndex[item.id]\"\n >\n <div class=\"cell-content\" [ngClass]=\"column.align\">\n <ng-container\n *ngIf=\"customComponents.get(column.id) as componentConfig; else defaultComponent\"\n >\n <ng-container\n *ngComponentOutlet=\"\n componentConfig.config.component;\n inputs: { rowItem: item };\n injector: componentConfig.injector\n \"\n ></ng-container>\n </ng-container>\n <ng-template #defaultComponent>\n <ng-container\n *ngTemplateOutlet=\"column.template; context: { item: item, depth: depth }\"\n ></ng-container>\n </ng-template>\n </div>\n </td>\n <td [class.active]=\"activeIndex === absoluteIndex[item.id]\"><!-- column select --></td>\n </tr>\n <ng-container *ngFor=\"let subCollection of getSubcollections(item)\">\n <ng-container\n *ngTemplateOutlet=\"collectionRowTmp; context: { item: subCollection, depth: depth + 1 }\"\n ></ng-container>\n </ng-container>\n</ng-template>\n", styles: [":host{display:block;max-width:100%;position:relative;margin-bottom:calc(var(--space-unit) * 4);container-type:inline-size}th{border-bottom:1px solid var(--color-table-header-border);color:var(--color-weight-700);font-size:var(--font-size-xs);font-weight:600;text-transform:uppercase;position:relative;white-space:nowrap;background-color:transparent}th,td{padding:calc(var(--space-unit) * 1.5) calc(var(--space-unit) * 1);color:var(--color-text-100)}tr td:first-of-type,tr th:first-of-type{text-align:center}@media screen and (min-width: 992px){tr td:first-of-type,tr th:first-of-type{padding-inline-start:var(--surface-margin-left);text-align:start}}th:last-of-type,td:last-of-type{border-inline-end:1px solid var(--color-table-header-border)}tr:first-of-type th:last-of-type{border-image:linear-gradient(0deg,var(--color-table-header-border),transparent) 1}tr:last-of-type td:last-of-type{border-image:linear-gradient(180deg,var(--color-table-header-border),transparent) 1}tbody td{border-bottom:1px solid var(--color-table-row-separator)}tbody tr:hover{background-color:var(--color-table-row-hover-bg)}.bulk-actions{margin-inline-start:calc(var(--space-unit) * 5);background-color:var(--color-surface-bg);z-index:10;display:flex;position:absolute;top:5px;height:40px}@media screen and (min-width: 992px){.bulk-actions{margin-inline-start:calc(var(--space-unit) * 8.5)}}@media screen and (min-width: 1280px){.bulk-actions{margin-inline-start:calc(var(--space-unit) * 10.5)}}.table-wrapper{display:block;overflow-y:hidden;overflow-x:auto;position:relative;width:100%;max-width:var(--surface-width)}table{width:100%}table.no-select{-webkit-user-select:none;user-select:none}.column-picker{width:24px}.sort-toggle{display:flex;align-items:center;margin-inline-start:calc(var(--space-unit) * .5)}.sort-toggle button{border:0;border-radius:var(--border-radius-lg);color:var(--color-weight-500);padding:0 2px;cursor:pointer;background-color:transparent}.sort-toggle button.active{color:var(--color-primary-700)}.sort-toggle .sort-label{margin-inline-start:calc(var(--space-unit) * .5);font-size:10px;color:var(--color-primary-600);font-weight:400}.toggle-search-filter-row{position:absolute;top:-12px;left:4px}@media screen and (min-width: 1280px){.toggle-search-filter-row{left:8px}}.toggle-search-filter-row.active{background-color:var(--color-primary-700);color:var(--color-primary-100);border-color:var(--color-primary-700)}th.filter-row{position:relative;font-size:var(--font-size-base);font-weight:400;background-color:var(--color-weight-100);box-shadow:var(--data-table-filter-box-shadow);border-left-width:0;border-right-width:0;text-align:initial;padding:0}th.filter-row input{width:100%}th.filter-row.active{border-bottom:1px solid var(--color-table-header-border)}th.filter-row .filters{margin-top:calc(var(--space-unit) * 1);display:flex;flex-wrap:wrap;gap:calc(var(--space-unit) * .5)}.filter-row-wrapper{padding:calc(var(--space-unit) * 4);padding-inline-start:0;max-height:150px;transition:max-height .2s,padding .2s,opacity .2s}.filter-row-wrapper.hidden{max-height:0px;padding-top:0;padding-bottom:0;overflow:hidden;opacity:0}.cell-link{display:block;width:100%;height:100%}td.active{background-color:var(--color-table-row-active-bg)}.cell-content{display:flex;align-items:center;line-height:var(--font-size-sm);color:var(--color-weight-700)}.cell-content.left{justify-content:flex-start}.cell-content.center{justify-content:center}.cell-content.right{justify-content:flex-end}.selection-col{width:calc(var(--space-unit) * 8)}vdr-empty-placeholder{width:100%}.table-footer{display:flex;align-items:baseline;justify-content:space-between;margin-top:var(--space-unit);margin-inline-start:var(--surface-margin-left);margin-inline-end:var(--space-unit)}.total-items-count{font-size:var(--font-size-xs)}@container (max-width: 500px){.total-items-count{display:none}}\n", ".bulk-actions{margin-inline-start:calc(var(--space-unit) * 6);background-color:var(--color-surface-bg)}@media screen and (min-width: 992px){.bulk-actions{margin-inline-start:calc(var(--space-unit) * 9.5)}}@media screen and (min-width: 1280px){.bulk-actions{margin-inline-start:calc(var(--space-unit) * 11.5)}}.drag-handle{cursor:grab}.drag-handle-spacer{width:16px}.cdk-drop-list-dragging .cdk-drag{transition:transform .25s cubic-bezier(0,0,.2,1)}.cdk-drag-animating{transition:transform .3s cubic-bezier(0,0,.2,1)}.cdk-drag-preview{opacity:0}.cdk-drag-placeholder{background-color:var(--color-primary-100)!important}\n"], dependencies: [{ kind: "directive", type: i3.ClrIconCustomTag, selector: "clr-icon" }, { kind: "directive", type: i3.ClrCheckbox, selector: "[clrCheckbox],[clrToggle]" }, { kind: "directive", type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"], exportAs: ["ngComponentOutlet"] }, { kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i4.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i4.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i4.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "component", type: i1.ItemsPerPageControlsComponent, selector: "vdr-items-per-page-controls", inputs: ["itemsPerPage"], outputs: ["itemsPerPageChange"] }, { kind: "component", type: i1.PaginationControlsComponent, selector: "vdr-pagination-controls", inputs: ["id", "currentPage", "itemsPerPage", "totalItems"], outputs: ["pageChange"] }, { kind: "directive", type: i1.FormFieldControlDirective, selector: "input, textarea, select, vdr-currency-input" }, { kind: "component", type: i1.EmptyPlaceholderComponent, selector: "vdr-empty-placeholder", inputs: ["emptyStateLabel"] }, { kind: "component", type: i1.UiExtensionPointComponent, selector: "vdr-ui-extension-point", inputs: ["locationId", "metadata", "topPx", "leftPx", "display", "api"] }, { kind: "component", type: i1.DataTableFiltersComponent, selector: "vdr-data-table-filters", inputs: ["filters", "filterWithValue"] }, { kind: "component", type: i1.DataTableColumnPickerComponent, selector: "vdr-data-table-colum-picker", inputs: ["columns", "uiLanguage"], outputs: ["reorder", "resetColumns"] }, { kind: "component", type: i1.DataTableFilterPresetsComponent, selector: "vdr-data-table-filter-presets", inputs: ["dataTableId", "filters"] }, { kind: "component", type: i1.AddFilterPresetButtonComponent, selector: "vdr-add-filter-preset-button", inputs: ["dataTableId", "filters"] }, { kind: "pipe", type: i3$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i5$2.PaginatePipe, name: "paginate" }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1767
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: CollectionDataTableComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.DataService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1768
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: CollectionDataTableComponent, isStandalone: false, selector: "vdr-collection-data-table", inputs: { subCollections: "subCollections" }, outputs: { changeOrder: "changeOrder" }, viewQueries: [{ propertyName: "dropList", first: true, predicate: CdkDropList, descendants: true, static: true }, { propertyName: "collectionRowList", predicate: ["collectionRow"], descendants: true, read: CdkDrag }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<vdr-data-table-filter-presets\n *ngIf=\"filters\"\n [filters]=\"filters\"\n [dataTableId]=\"id\"\n></vdr-data-table-filter-presets>\n<div class=\"table-wrapper\">\n <div class=\"bulk-actions\">\n <ng-content select=\"vdr-bulk-action-menu\"></ng-content>\n </div>\n <table class=\"\" [class.no-select]=\"disableSelect\">\n <thead [class.items-selected]=\"selectionManager?.selection.length\">\n <tr class=\"heading-row\">\n <th *ngIf=\"selectionManager\" class=\"selection-col\">\n <div class=\"flex\">\n <div class=\"drag-handle-spacer\"></div>\n <input\n type=\"checkbox\"\n clrCheckbox\n [checked]=\"selectionManager?.areAllCurrentItemsSelected()\"\n (change)=\"onToggleAllClick()\"\n />\n </div>\n </th>\n <th\n *ngFor=\"let column of visibleSortedColumns; last as isLast\"\n [class.expand]=\"column.expand\"\n >\n <div class=\"cell-content\" [ngClass]=\"column.align\">\n <vdr-ui-extension-point\n [locationId]=\"id\"\n [metadata]=\"column.id\"\n api=\"dataTable\"\n [topPx]=\"-6\"\n [leftPx]=\"-24\"\n display=\"block\"\n >\n <span>{{ column.heading }}</span>\n </vdr-ui-extension-point>\n <div *ngIf=\"column.sort as sort\" class=\"sort-toggle\">\n <button (click)=\"sort.toggleSortOrder()\" [class.active]=\"sort.sortOrder\">\n <clr-icon *ngIf=\"!sort.sortOrder\" shape=\"two-way-arrows left\"></clr-icon>\n <clr-icon *ngIf=\"sort.sortOrder === 'ASC'\" shape=\"arrow up\"></clr-icon>\n <clr-icon *ngIf=\"sort.sortOrder === 'DESC'\" shape=\"arrow down\"></clr-icon>\n </button>\n <div class=\"sort-label\" *ngIf=\"sort.sortOrder\">{{ sort.sortOrder }}</div>\n </div>\n </div>\n </th>\n <th>\n <div class=\"column-picker\">\n <vdr-data-table-colum-picker\n [uiLanguage]=\"uiLanguage$ | async\"\n [columns]=\"sortedColumns\"\n (reorder)=\"onColumnReorder($event)\"\n (resetColumns)=\"onColumnsReset()\"\n ></vdr-data-table-colum-picker>\n </div>\n </th>\n </tr>\n <tr *ngIf=\"searchComponent || customSearchTemplate || filters?.length\">\n <th\n [attr.colspan]=\"visibleSortedColumns.length + (selectionManager ? 2 : 1)\"\n class=\"filter-row\"\n [class.active]=\"showSearchFilterRow\"\n >\n <button\n class=\"button-ghost toggle-search-filter-row\"\n [class.active]=\"showSearchFilterRow\"\n (click)=\"toggleSearchFilterRow()\"\n [title]=\"'common.search-and-filter-list' | translate\"\n >\n <clr-icon shape=\"search\"></clr-icon>\n </button>\n <div class=\"filter-row-wrapper\" [class.hidden]=\"!showSearchFilterRow\">\n <ng-container *ngTemplateOutlet=\"searchComponent?.template\"></ng-container>\n <ng-container *ngTemplateOutlet=\"customSearchTemplate\"></ng-container>\n <ng-container *ngIf=\"filters\">\n <div class=\"filters\">\n <vdr-data-table-filters\n *ngFor=\"let activeFilter of filters.activeFilters\"\n [filterWithValue]=\"activeFilter\"\n [filters]=\"filters\"\n class=\"mt-1\"\n ></vdr-data-table-filters>\n <vdr-data-table-filters\n *ngIf=\"filters.length\"\n [filters]=\"filters\"\n class=\"mt-1\"\n ></vdr-data-table-filters>\n <vdr-add-filter-preset-button\n [filters]=\"filters\"\n [dataTableId]=\"id\"\n ></vdr-add-filter-preset-button>\n </div>\n </ng-container>\n </div>\n </th>\n </tr>\n </thead>\n <tbody\n cdkDropList\n cdkDropListLockAxis=\"y\"\n (cdkDropListDropped)=\"onDrop($event)\"\n [cdkDropListSortPredicate]=\"sortPredicate\"\n >\n <ng-container\n *ngFor=\"\n let item of items\n | paginate\n : {\n itemsPerPage: itemsPerPage,\n currentPage: currentPage,\n totalItems: totalItems,\n id: id,\n };\n index as i;\n trackBy: trackByFn.bind(this)\n \"\n >\n <ng-container\n [ngTemplateOutlet]=\"collectionRowTmp\"\n [ngTemplateOutletContext]=\"{ item: item, i: i, depth: 0 }\"\n ></ng-container>\n </ng-container>\n <ng-container>\n <tr *ngIf=\"!items?.length\">\n <td [attr.colspan]=\"visibleSortedColumns.length + (selectionManager ? 2 : 1)\">\n <vdr-empty-placeholder [emptyStateLabel]=\"emptyStateLabel\"></vdr-empty-placeholder>\n </td>\n </tr>\n </ng-container>\n </tbody>\n </table>\n</div>\n<div class=\"table-footer\">\n <vdr-items-per-page-controls\n *ngIf=\"totalItems\"\n [itemsPerPage]=\"itemsPerPage\"\n (itemsPerPageChange)=\"itemsPerPageChange.emit($event)\"\n ></vdr-items-per-page-controls>\n <div *ngIf=\"totalItems\" class=\"p5 total-items-count\">\n {{ 'common.total-items' | translate : { currentStart, currentEnd, totalItems } }}\n </div>\n\n <vdr-pagination-controls\n *ngIf=\"totalItems\"\n [id]=\"id\"\n [currentPage]=\"currentPage\"\n [itemsPerPage]=\"itemsPerPage\"\n [totalItems]=\"totalItems\"\n (pageChange)=\"pageChange.emit($event)\"\n ></vdr-pagination-controls>\n</div>\n\n<ng-template #collectionRowTmp let-item=\"item\" let-depth=\"depth\">\n <tr #collectionRow cdkDrag [cdkDragData]=\"{ depth: depth, collection: item }\" cdkDragBoundary=\"tbody\">\n <td\n *ngIf=\"selectionManager\"\n [class.active]=\"activeIndex === absoluteIndex[item.id]\"\n class=\"selection-col\"\n >\n <div class=\"flex\">\n <div class=\"drag-handle\" cdkDragHandle [title]=\"'catalog.reorder-collection' | translate\">\n <clr-icon shape=\"drag-handle\"></clr-icon>\n </div>\n <input\n type=\"checkbox\"\n clrCheckbox\n [checked]=\"selectionManager?.isSelected(item)\"\n (click)=\"onRowClick(item, $event)\"\n />\n </div>\n </td>\n <td\n *ngFor=\"let column of visibleSortedColumns\"\n [class.active]=\"activeIndex === absoluteIndex[item.id]\"\n >\n <div class=\"cell-content\" [ngClass]=\"column.align\">\n <ng-container\n *ngIf=\"customComponents.get(column.id) as componentConfig; else defaultComponent\"\n >\n <ng-container\n *ngComponentOutlet=\"\n componentConfig.config.component;\n inputs: { rowItem: item };\n injector: componentConfig.injector\n \"\n ></ng-container>\n </ng-container>\n <ng-template #defaultComponent>\n <ng-container\n *ngTemplateOutlet=\"column.template; context: { item: item, depth: depth }\"\n ></ng-container>\n </ng-template>\n </div>\n </td>\n <td [class.active]=\"activeIndex === absoluteIndex[item.id]\"><!-- column select --></td>\n </tr>\n <ng-container *ngFor=\"let subCollection of getSubcollections(item)\">\n <ng-container\n *ngTemplateOutlet=\"collectionRowTmp; context: { item: subCollection, depth: depth + 1 }\"\n ></ng-container>\n </ng-container>\n</ng-template>\n", styles: [":host{display:block;max-width:100%;position:relative;margin-bottom:calc(var(--space-unit) * 4);container-type:inline-size}th{border-bottom:1px solid var(--color-table-header-border);color:var(--color-weight-700);font-size:var(--font-size-xs);font-weight:600;text-transform:uppercase;position:relative;white-space:nowrap;background-color:transparent}th,td{padding:calc(var(--space-unit) * 1.5) calc(var(--space-unit) * 1);color:var(--color-text-100)}tr td:first-of-type,tr th:first-of-type{text-align:center}@media screen and (min-width: 992px){tr td:first-of-type,tr th:first-of-type{padding-inline-start:var(--surface-margin-left);text-align:start}}th:last-of-type,td:last-of-type{border-inline-end:1px solid var(--color-table-header-border)}tr:first-of-type th:last-of-type{border-image:linear-gradient(0deg,var(--color-table-header-border),transparent) 1}tr:last-of-type td:last-of-type{border-image:linear-gradient(180deg,var(--color-table-header-border),transparent) 1}tbody td{border-bottom:1px solid var(--color-table-row-separator)}tbody tr:hover{background-color:var(--color-table-row-hover-bg)}.bulk-actions{margin-inline-start:calc(var(--space-unit) * 5);background-color:var(--color-surface-bg);z-index:10;display:flex;position:absolute;top:5px;height:40px}@media screen and (min-width: 992px){.bulk-actions{margin-inline-start:calc(var(--space-unit) * 8.5)}}@media screen and (min-width: 1280px){.bulk-actions{margin-inline-start:calc(var(--space-unit) * 10.5)}}.table-wrapper{display:block;overflow-y:hidden;overflow-x:auto;position:relative;width:100%;max-width:var(--surface-width)}table{width:100%}table.no-select{-webkit-user-select:none;user-select:none}.column-picker{width:24px}.sort-toggle{display:flex;align-items:center;margin-inline-start:calc(var(--space-unit) * .5)}.sort-toggle button{border:0;border-radius:var(--border-radius-lg);color:var(--color-weight-500);padding:0 2px;cursor:pointer;background-color:transparent}.sort-toggle button.active{color:var(--color-primary-700)}.sort-toggle .sort-label{margin-inline-start:calc(var(--space-unit) * .5);font-size:10px;color:var(--color-primary-600);font-weight:400}.toggle-search-filter-row{position:absolute;top:-12px;left:4px}@media screen and (min-width: 1280px){.toggle-search-filter-row{left:8px}}.toggle-search-filter-row.active{background-color:var(--color-primary-700);color:var(--color-primary-100);border-color:var(--color-primary-700)}th.filter-row{position:relative;font-size:var(--font-size-base);font-weight:400;background-color:var(--color-weight-100);box-shadow:var(--data-table-filter-box-shadow);border-left-width:0;border-right-width:0;text-align:initial;padding:0}th.filter-row input{width:100%}th.filter-row.active{border-bottom:1px solid var(--color-table-header-border)}th.filter-row .filters{margin-top:calc(var(--space-unit) * 1);display:flex;flex-wrap:wrap;gap:calc(var(--space-unit) * .5)}.filter-row-wrapper{padding:calc(var(--space-unit) * 4);padding-inline-start:0;max-height:150px;transition:max-height .2s,padding .2s,opacity .2s}.filter-row-wrapper.hidden{max-height:0px;padding-top:0;padding-bottom:0;overflow:hidden;opacity:0}.cell-link{display:block;width:100%;height:100%}td.active{background-color:var(--color-table-row-active-bg)}.cell-content{display:flex;align-items:center;line-height:var(--font-size-sm);color:var(--color-weight-700)}.cell-content.left{justify-content:flex-start}.cell-content.center{justify-content:center}.cell-content.right{justify-content:flex-end}.selection-col{width:calc(var(--space-unit) * 8)}vdr-empty-placeholder{width:100%}.table-footer{display:flex;align-items:baseline;justify-content:space-between;margin-top:var(--space-unit);margin-inline-start:var(--surface-margin-left);margin-inline-end:var(--space-unit)}.total-items-count{font-size:var(--font-size-xs)}@container (max-width: 500px){.total-items-count{display:none}}\n", ".bulk-actions{margin-inline-start:calc(var(--space-unit) * 6);background-color:var(--color-surface-bg)}@media screen and (min-width: 992px){.bulk-actions{margin-inline-start:calc(var(--space-unit) * 9.5)}}@media screen and (min-width: 1280px){.bulk-actions{margin-inline-start:calc(var(--space-unit) * 11.5)}}.drag-handle{cursor:grab}.drag-handle-spacer{width:16px}.cdk-drop-list-dragging .cdk-drag{transition:transform .25s cubic-bezier(0,0,.2,1)}.cdk-drag-animating{transition:transform .3s cubic-bezier(0,0,.2,1)}.cdk-drag-preview{opacity:0}.cdk-drag-placeholder{background-color:var(--color-primary-100)!important}\n"], dependencies: [{ kind: "directive", type: i3.ClrIconCustomTag, selector: "clr-icon" }, { kind: "directive", type: i3.ClrCheckbox, selector: "[clrCheckbox],[clrToggle]" }, { kind: "directive", type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"], exportAs: ["ngComponentOutlet"] }, { kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i4.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i4.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i4.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "component", type: i1.ItemsPerPageControlsComponent, selector: "vdr-items-per-page-controls", inputs: ["itemsPerPage"], outputs: ["itemsPerPageChange"] }, { kind: "component", type: i1.PaginationControlsComponent, selector: "vdr-pagination-controls", inputs: ["id", "currentPage", "itemsPerPage", "totalItems"], outputs: ["pageChange"] }, { kind: "directive", type: i1.FormFieldControlDirective, selector: "input, textarea, select, vdr-currency-input" }, { kind: "component", type: i1.EmptyPlaceholderComponent, selector: "vdr-empty-placeholder", inputs: ["emptyStateLabel"] }, { kind: "component", type: i1.UiExtensionPointComponent, selector: "vdr-ui-extension-point", inputs: ["locationId", "metadata", "topPx", "leftPx", "display", "api"] }, { kind: "component", type: i1.DataTableFiltersComponent, selector: "vdr-data-table-filters", inputs: ["filters", "filterWithValue"] }, { kind: "component", type: i1.DataTableColumnPickerComponent, selector: "vdr-data-table-colum-picker", inputs: ["columns", "uiLanguage"], outputs: ["reorder", "resetColumns"] }, { kind: "component", type: i1.DataTableFilterPresetsComponent, selector: "vdr-data-table-filter-presets", inputs: ["dataTableId", "filters"] }, { kind: "component", type: i1.AddFilterPresetButtonComponent, selector: "vdr-add-filter-preset-button", inputs: ["dataTableId", "filters"] }, { kind: "pipe", type: i3$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i5$2.PaginatePipe, name: "paginate" }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1769
1769
|
}
|
|
1770
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
1770
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: CollectionDataTableComponent, decorators: [{
|
|
1771
1771
|
type: Component,
|
|
1772
1772
|
args: [{ selector: 'vdr-collection-data-table', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<vdr-data-table-filter-presets\n *ngIf=\"filters\"\n [filters]=\"filters\"\n [dataTableId]=\"id\"\n></vdr-data-table-filter-presets>\n<div class=\"table-wrapper\">\n <div class=\"bulk-actions\">\n <ng-content select=\"vdr-bulk-action-menu\"></ng-content>\n </div>\n <table class=\"\" [class.no-select]=\"disableSelect\">\n <thead [class.items-selected]=\"selectionManager?.selection.length\">\n <tr class=\"heading-row\">\n <th *ngIf=\"selectionManager\" class=\"selection-col\">\n <div class=\"flex\">\n <div class=\"drag-handle-spacer\"></div>\n <input\n type=\"checkbox\"\n clrCheckbox\n [checked]=\"selectionManager?.areAllCurrentItemsSelected()\"\n (change)=\"onToggleAllClick()\"\n />\n </div>\n </th>\n <th\n *ngFor=\"let column of visibleSortedColumns; last as isLast\"\n [class.expand]=\"column.expand\"\n >\n <div class=\"cell-content\" [ngClass]=\"column.align\">\n <vdr-ui-extension-point\n [locationId]=\"id\"\n [metadata]=\"column.id\"\n api=\"dataTable\"\n [topPx]=\"-6\"\n [leftPx]=\"-24\"\n display=\"block\"\n >\n <span>{{ column.heading }}</span>\n </vdr-ui-extension-point>\n <div *ngIf=\"column.sort as sort\" class=\"sort-toggle\">\n <button (click)=\"sort.toggleSortOrder()\" [class.active]=\"sort.sortOrder\">\n <clr-icon *ngIf=\"!sort.sortOrder\" shape=\"two-way-arrows left\"></clr-icon>\n <clr-icon *ngIf=\"sort.sortOrder === 'ASC'\" shape=\"arrow up\"></clr-icon>\n <clr-icon *ngIf=\"sort.sortOrder === 'DESC'\" shape=\"arrow down\"></clr-icon>\n </button>\n <div class=\"sort-label\" *ngIf=\"sort.sortOrder\">{{ sort.sortOrder }}</div>\n </div>\n </div>\n </th>\n <th>\n <div class=\"column-picker\">\n <vdr-data-table-colum-picker\n [uiLanguage]=\"uiLanguage$ | async\"\n [columns]=\"sortedColumns\"\n (reorder)=\"onColumnReorder($event)\"\n (resetColumns)=\"onColumnsReset()\"\n ></vdr-data-table-colum-picker>\n </div>\n </th>\n </tr>\n <tr *ngIf=\"searchComponent || customSearchTemplate || filters?.length\">\n <th\n [attr.colspan]=\"visibleSortedColumns.length + (selectionManager ? 2 : 1)\"\n class=\"filter-row\"\n [class.active]=\"showSearchFilterRow\"\n >\n <button\n class=\"button-ghost toggle-search-filter-row\"\n [class.active]=\"showSearchFilterRow\"\n (click)=\"toggleSearchFilterRow()\"\n [title]=\"'common.search-and-filter-list' | translate\"\n >\n <clr-icon shape=\"search\"></clr-icon>\n </button>\n <div class=\"filter-row-wrapper\" [class.hidden]=\"!showSearchFilterRow\">\n <ng-container *ngTemplateOutlet=\"searchComponent?.template\"></ng-container>\n <ng-container *ngTemplateOutlet=\"customSearchTemplate\"></ng-container>\n <ng-container *ngIf=\"filters\">\n <div class=\"filters\">\n <vdr-data-table-filters\n *ngFor=\"let activeFilter of filters.activeFilters\"\n [filterWithValue]=\"activeFilter\"\n [filters]=\"filters\"\n class=\"mt-1\"\n ></vdr-data-table-filters>\n <vdr-data-table-filters\n *ngIf=\"filters.length\"\n [filters]=\"filters\"\n class=\"mt-1\"\n ></vdr-data-table-filters>\n <vdr-add-filter-preset-button\n [filters]=\"filters\"\n [dataTableId]=\"id\"\n ></vdr-add-filter-preset-button>\n </div>\n </ng-container>\n </div>\n </th>\n </tr>\n </thead>\n <tbody\n cdkDropList\n cdkDropListLockAxis=\"y\"\n (cdkDropListDropped)=\"onDrop($event)\"\n [cdkDropListSortPredicate]=\"sortPredicate\"\n >\n <ng-container\n *ngFor=\"\n let item of items\n | paginate\n : {\n itemsPerPage: itemsPerPage,\n currentPage: currentPage,\n totalItems: totalItems,\n id: id,\n };\n index as i;\n trackBy: trackByFn.bind(this)\n \"\n >\n <ng-container\n [ngTemplateOutlet]=\"collectionRowTmp\"\n [ngTemplateOutletContext]=\"{ item: item, i: i, depth: 0 }\"\n ></ng-container>\n </ng-container>\n <ng-container>\n <tr *ngIf=\"!items?.length\">\n <td [attr.colspan]=\"visibleSortedColumns.length + (selectionManager ? 2 : 1)\">\n <vdr-empty-placeholder [emptyStateLabel]=\"emptyStateLabel\"></vdr-empty-placeholder>\n </td>\n </tr>\n </ng-container>\n </tbody>\n </table>\n</div>\n<div class=\"table-footer\">\n <vdr-items-per-page-controls\n *ngIf=\"totalItems\"\n [itemsPerPage]=\"itemsPerPage\"\n (itemsPerPageChange)=\"itemsPerPageChange.emit($event)\"\n ></vdr-items-per-page-controls>\n <div *ngIf=\"totalItems\" class=\"p5 total-items-count\">\n {{ 'common.total-items' | translate : { currentStart, currentEnd, totalItems } }}\n </div>\n\n <vdr-pagination-controls\n *ngIf=\"totalItems\"\n [id]=\"id\"\n [currentPage]=\"currentPage\"\n [itemsPerPage]=\"itemsPerPage\"\n [totalItems]=\"totalItems\"\n (pageChange)=\"pageChange.emit($event)\"\n ></vdr-pagination-controls>\n</div>\n\n<ng-template #collectionRowTmp let-item=\"item\" let-depth=\"depth\">\n <tr #collectionRow cdkDrag [cdkDragData]=\"{ depth: depth, collection: item }\" cdkDragBoundary=\"tbody\">\n <td\n *ngIf=\"selectionManager\"\n [class.active]=\"activeIndex === absoluteIndex[item.id]\"\n class=\"selection-col\"\n >\n <div class=\"flex\">\n <div class=\"drag-handle\" cdkDragHandle [title]=\"'catalog.reorder-collection' | translate\">\n <clr-icon shape=\"drag-handle\"></clr-icon>\n </div>\n <input\n type=\"checkbox\"\n clrCheckbox\n [checked]=\"selectionManager?.isSelected(item)\"\n (click)=\"onRowClick(item, $event)\"\n />\n </div>\n </td>\n <td\n *ngFor=\"let column of visibleSortedColumns\"\n [class.active]=\"activeIndex === absoluteIndex[item.id]\"\n >\n <div class=\"cell-content\" [ngClass]=\"column.align\">\n <ng-container\n *ngIf=\"customComponents.get(column.id) as componentConfig; else defaultComponent\"\n >\n <ng-container\n *ngComponentOutlet=\"\n componentConfig.config.component;\n inputs: { rowItem: item };\n injector: componentConfig.injector\n \"\n ></ng-container>\n </ng-container>\n <ng-template #defaultComponent>\n <ng-container\n *ngTemplateOutlet=\"column.template; context: { item: item, depth: depth }\"\n ></ng-container>\n </ng-template>\n </div>\n </td>\n <td [class.active]=\"activeIndex === absoluteIndex[item.id]\"><!-- column select --></td>\n </tr>\n <ng-container *ngFor=\"let subCollection of getSubcollections(item)\">\n <ng-container\n *ngTemplateOutlet=\"collectionRowTmp; context: { item: subCollection, depth: depth + 1 }\"\n ></ng-container>\n </ng-container>\n</ng-template>\n", styles: [":host{display:block;max-width:100%;position:relative;margin-bottom:calc(var(--space-unit) * 4);container-type:inline-size}th{border-bottom:1px solid var(--color-table-header-border);color:var(--color-weight-700);font-size:var(--font-size-xs);font-weight:600;text-transform:uppercase;position:relative;white-space:nowrap;background-color:transparent}th,td{padding:calc(var(--space-unit) * 1.5) calc(var(--space-unit) * 1);color:var(--color-text-100)}tr td:first-of-type,tr th:first-of-type{text-align:center}@media screen and (min-width: 992px){tr td:first-of-type,tr th:first-of-type{padding-inline-start:var(--surface-margin-left);text-align:start}}th:last-of-type,td:last-of-type{border-inline-end:1px solid var(--color-table-header-border)}tr:first-of-type th:last-of-type{border-image:linear-gradient(0deg,var(--color-table-header-border),transparent) 1}tr:last-of-type td:last-of-type{border-image:linear-gradient(180deg,var(--color-table-header-border),transparent) 1}tbody td{border-bottom:1px solid var(--color-table-row-separator)}tbody tr:hover{background-color:var(--color-table-row-hover-bg)}.bulk-actions{margin-inline-start:calc(var(--space-unit) * 5);background-color:var(--color-surface-bg);z-index:10;display:flex;position:absolute;top:5px;height:40px}@media screen and (min-width: 992px){.bulk-actions{margin-inline-start:calc(var(--space-unit) * 8.5)}}@media screen and (min-width: 1280px){.bulk-actions{margin-inline-start:calc(var(--space-unit) * 10.5)}}.table-wrapper{display:block;overflow-y:hidden;overflow-x:auto;position:relative;width:100%;max-width:var(--surface-width)}table{width:100%}table.no-select{-webkit-user-select:none;user-select:none}.column-picker{width:24px}.sort-toggle{display:flex;align-items:center;margin-inline-start:calc(var(--space-unit) * .5)}.sort-toggle button{border:0;border-radius:var(--border-radius-lg);color:var(--color-weight-500);padding:0 2px;cursor:pointer;background-color:transparent}.sort-toggle button.active{color:var(--color-primary-700)}.sort-toggle .sort-label{margin-inline-start:calc(var(--space-unit) * .5);font-size:10px;color:var(--color-primary-600);font-weight:400}.toggle-search-filter-row{position:absolute;top:-12px;left:4px}@media screen and (min-width: 1280px){.toggle-search-filter-row{left:8px}}.toggle-search-filter-row.active{background-color:var(--color-primary-700);color:var(--color-primary-100);border-color:var(--color-primary-700)}th.filter-row{position:relative;font-size:var(--font-size-base);font-weight:400;background-color:var(--color-weight-100);box-shadow:var(--data-table-filter-box-shadow);border-left-width:0;border-right-width:0;text-align:initial;padding:0}th.filter-row input{width:100%}th.filter-row.active{border-bottom:1px solid var(--color-table-header-border)}th.filter-row .filters{margin-top:calc(var(--space-unit) * 1);display:flex;flex-wrap:wrap;gap:calc(var(--space-unit) * .5)}.filter-row-wrapper{padding:calc(var(--space-unit) * 4);padding-inline-start:0;max-height:150px;transition:max-height .2s,padding .2s,opacity .2s}.filter-row-wrapper.hidden{max-height:0px;padding-top:0;padding-bottom:0;overflow:hidden;opacity:0}.cell-link{display:block;width:100%;height:100%}td.active{background-color:var(--color-table-row-active-bg)}.cell-content{display:flex;align-items:center;line-height:var(--font-size-sm);color:var(--color-weight-700)}.cell-content.left{justify-content:flex-start}.cell-content.center{justify-content:center}.cell-content.right{justify-content:flex-end}.selection-col{width:calc(var(--space-unit) * 8)}vdr-empty-placeholder{width:100%}.table-footer{display:flex;align-items:baseline;justify-content:space-between;margin-top:var(--space-unit);margin-inline-start:var(--surface-margin-left);margin-inline-end:var(--space-unit)}.total-items-count{font-size:var(--font-size-xs)}@container (max-width: 500px){.total-items-count{display:none}}\n", ".bulk-actions{margin-inline-start:calc(var(--space-unit) * 6);background-color:var(--color-surface-bg)}@media screen and (min-width: 992px){.bulk-actions{margin-inline-start:calc(var(--space-unit) * 9.5)}}@media screen and (min-width: 1280px){.bulk-actions{margin-inline-start:calc(var(--space-unit) * 11.5)}}.drag-handle{cursor:grab}.drag-handle-spacer{width:16px}.cdk-drop-list-dragging .cdk-drag{transition:transform .25s cubic-bezier(0,0,.2,1)}.cdk-drag-animating{transition:transform .3s cubic-bezier(0,0,.2,1)}.cdk-drag-preview{opacity:0}.cdk-drag-placeholder{background-color:var(--color-primary-100)!important}\n"] }]
|
|
1773
1773
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1.DataService }], propDecorators: { subCollections: [{
|
|
@@ -2018,10 +2018,10 @@ class CollectionDetailComponent extends TypedBaseDetailComponent {
|
|
|
2018
2018
|
})),
|
|
2019
2019
|
}));
|
|
2020
2020
|
}
|
|
2021
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
2022
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: CollectionDetailComponent, isStandalone: false, selector: "vdr-collection-detail", viewQueries: [{ propertyName: "contentsComponent", first: true, predicate: ["collectionContents"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<vdr-page-block>\n <vdr-action-bar>\n <vdr-ab-left>\n <vdr-language-selector\n [disabled]=\"isNew$ | async\"\n [availableLanguageCodes]=\"availableLanguages$ | async\"\n [currentLanguageCode]=\"languageCode$ | async\"\n (languageCodeChange)=\"setLanguage($event)\"\n ></vdr-language-selector>\n </vdr-ab-left>\n <vdr-ab-right>\n <vdr-action-bar-items locationId=\"collection-detail\" />\n <button\n class=\"btn btn-primary\"\n *ngIf=\"isNew$ | async; else updateButton\"\n (click)=\"create()\"\n [disabled]=\"detailForm.invalid || detailForm.pristine\"\n >\n {{ 'common.create' | translate }}\n </button>\n <ng-template #updateButton>\n <button\n *vdrIfPermissions=\"updatePermission\"\n class=\"btn btn-primary\"\n (click)=\"save()\"\n [disabled]=\"(detailForm.invalid || detailForm.pristine) && !assetsChanged()\"\n >\n {{ 'common.update' | translate }}\n </button>\n </ng-template>\n <vdr-action-bar-dropdown-menu locationId=\"collection-detail\" />\n </vdr-ab-right>\n </vdr-action-bar>\n</vdr-page-block>\n<form class=\"form\" [formGroup]=\"detailForm\">\n <vdr-page-detail-layout>\n <vdr-page-detail-sidebar>\n <vdr-card>\n <vdr-form-field [label]=\"'catalog.visibility' | translate\" for=\"visibility\">\n <clr-toggle-wrapper>\n <input\n type=\"checkbox\"\n clrToggle\n formControlName=\"visible\"\n id=\"visibility\"\n [vdrDisabled]=\"!(updatePermission | hasPermission)\"\n />\n <label class=\"visible-toggle\">\n <ng-container *ngIf=\"detailForm.value.visible; else private\">{{\n 'catalog.public' | translate\n }}</ng-container>\n <ng-template #private>{{ 'catalog.private' | translate }}</ng-template>\n </label>\n </clr-toggle-wrapper>\n </vdr-form-field>\n </vdr-card>\n <vdr-card *ngIf=\"entity$ | async as entity\">\n <vdr-page-entity-info [entity]=\"entity\"></vdr-page-entity-info>\n </vdr-card>\n </vdr-page-detail-sidebar>\n\n <vdr-page-block *ngIf=\"entity$ | async as entity\"\n ><nav role=\"navigation\">\n <ul class=\"collection-breadcrumbs\">\n <li *ngFor=\"let breadcrumb of entity.breadcrumbs; let isFirst = first; let isLast = last\">\n <a [routerLink]=\"['/catalog/collections']\" *ngIf=\"isFirst\">{{\n 'catalog.root-collection' | translate\n }}</a>\n <a\n [routerLink]=\"['/catalog/collections', breadcrumb.id]\"\n *ngIf=\"!isFirst && !isLast\"\n >{{ breadcrumb.name | translate }}</a\n >\n <ng-container *ngIf=\"isLast\">{{ breadcrumb.name | translate }}</ng-container>\n </li>\n </ul>\n </nav>\n </vdr-page-block>\n\n <vdr-page-block>\n <vdr-card>\n <div class=\"form-grid\">\n <vdr-form-field [label]=\"'common.name' | translate\" for=\"name\">\n <input\n id=\"name\"\n type=\"text\"\n formControlName=\"name\"\n [readonly]=\"!(updatePermission | hasPermission)\"\n (input)=\"updateSlug($event.target.value)\"\n />\n </vdr-form-field>\n <vdr-form-field\n [label]=\"'catalog.slug' | translate\"\n for=\"slug\"\n [errors]=\"{ pattern: ('catalog.slug-pattern-error' | translate) }\"\n >\n <input\n id=\"slug\"\n type=\"text\"\n formControlName=\"slug\"\n [readonly]=\"!(updatePermission | hasPermission)\"\n />\n </vdr-form-field>\n <vdr-form-field\n class=\"form-grid-span\"\n [label]=\"'common.description' | translate\"\n for=\"slug\"\n >\n <vdr-rich-text-editor\n formControlName=\"description\"\n [readonly]=\"!(updatePermission | hasPermission)\"\n ></vdr-rich-text-editor>\n </vdr-form-field>\n </div>\n </vdr-card>\n <vdr-card\n formGroupName=\"customFields\"\n *ngIf=\"customFields.length\"\n [title]=\"'common.custom-fields' | translate\"\n >\n <vdr-tabbed-custom-fields\n entityName=\"Collection\"\n [customFields]=\"customFields\"\n [customFieldsFormGroup]=\"detailForm.get('customFields')\"\n [readonly]=\"!(updatePermission | hasPermission)\"\n ></vdr-tabbed-custom-fields>\n </vdr-card>\n <vdr-custom-detail-component-host\n locationId=\"collection-detail\"\n [entity$]=\"entity$\"\n [detailForm]=\"detailForm\"\n ></vdr-custom-detail-component-host>\n <vdr-card [title]=\"'catalog.assets' | translate\">\n <vdr-assets\n [assets]=\"entity?.assets\"\n [featuredAsset]=\"entity?.featuredAsset\"\n [updatePermissions]=\"updatePermission\"\n (change)=\"assetChanges = $event\"\n ></vdr-assets>\n </vdr-card>\n <vdr-card [title]=\"'catalog.filters' | translate\">\n <vdr-form-field [label]=\"'catalog.filter-inheritance' | translate\" for=\"inheritFilters\">\n <clr-toggle-wrapper>\n <input\n type=\"checkbox\"\n clrToggle\n formControlName=\"inheritFilters\"\n id=\"inheritFilters\"\n [vdrDisabled]=\"!(updatePermission | hasPermission)\"\n />\n <label class=\"visible-toggle\">\n <ng-container *ngIf=\"detailForm.value.inheritFilters; else noInherit\">{{\n 'catalog.inherit-filters-from-parent' | translate\n }}</ng-container>\n <ng-template #noInherit>{{\n 'catalog.do-not-inherit-filters' | translate\n }}</ng-template>\n </label>\n </clr-toggle-wrapper>\n </vdr-form-field>\n <div formArrayName=\"filters\">\n <ng-container *ngFor=\"let filter of filters; index as i; trackBy: trackByFn\">\n <vdr-configurable-input\n (remove)=\"removeFilter(i)\"\n [position]=\"i\"\n [operation]=\"filter\"\n [operationDefinition]=\"getFilterDefinition(filter)\"\n [formControlName]=\"i\"\n [readonly]=\"!(updatePermission | hasPermission)\"\n ></vdr-configurable-input>\n </ng-container>\n </div>\n <div *vdrIfPermissions=\"updatePermission\">\n <vdr-dropdown>\n <button class=\"btn btn-outline\" vdrDropdownTrigger>\n <clr-icon shape=\"plus\"></clr-icon>\n <span>{{ 'marketing.add-condition' | translate }}</span>\n <clr-icon shape=\"ellipsis-vertical\"></clr-icon>\n </button>\n <vdr-dropdown-menu vdrPosition=\"bottom-left\">\n <button\n *ngFor=\"let filter of allFilters\"\n type=\"button\"\n vdrDropdownItem\n (click)=\"addFilter(filter)\"\n >\n {{ filter.description }}\n </button>\n </vdr-dropdown-menu>\n </vdr-dropdown>\n </div>\n </vdr-card>\n\n <vdr-card [title]=\"'common.contents' | translate\" [paddingX]=\"false\">\n <vdr-collection-contents\n [collectionId]=\"id\"\n [parentId]=\"parentId$ | async\"\n [updatedFilters]=\"updatedFilters$ | async\"\n [inheritFilters]=\"inheritFilters$ | async\"\n [previewUpdatedFilters]=\"livePreview\"\n #collectionContents\n >\n <ng-template let-count>\n <div class=\"ml-3\">\n <div class=\"contents-title\">\n {{ 'catalog.collection-contents' | translate }} ({{\n 'common.results-count' | translate : { count: count }\n }})\n </div>\n <clr-checkbox-wrapper [class.disabled]=\"detailForm.get('filters')?.pristine\">\n <input\n type=\"checkbox\"\n clrCheckbox\n [ngModelOptions]=\"{ standalone: true }\"\n [disabled]=\"detailForm.get('filters')?.pristine\"\n [ngModel]=\"livePreview\"\n (ngModelChange)=\"toggleLivePreview()\"\n />\n <label>{{ 'catalog.live-preview-contents' | translate }}</label>\n </clr-checkbox-wrapper>\n </div>\n </ng-template>\n </vdr-collection-contents>\n </vdr-card>\n </vdr-page-block>\n </vdr-page-detail-layout>\n</form>\n", styles: ["@charset \"UTF-8\";.visible-toggle{margin-top:-3px!important}clr-checkbox-wrapper{transition:opacity .3s}clr-checkbox-wrapper.disabled{opacity:.5}.collection-breadcrumbs{list-style-type:none;background-color:var(--color-component-bg-200);padding:2px 6px;margin-bottom:6px;border-radius:var(--clr-global-borderradius)}.collection-breadcrumbs li{font-size:.65rem;display:inline-block;margin-inline-end:10px}.collection-breadcrumbs li:last-child{font-weight:600}.collection-breadcrumbs li:not(:last-child):after{content:\"\\203a\";top:0;color:var(--color-grey-400);margin-inline-start:10px}\n"], dependencies: [{ kind: "directive", type: i3.ClrIconCustomTag, selector: "clr-icon" }, { kind: "directive", type: i3.ClrLabel, selector: "label", inputs: ["id", "for"] }, { kind: "directive", type: i3.ClrCheckbox, selector: "[clrCheckbox],[clrToggle]" }, { kind: "component", type: i3.ClrCheckboxWrapper, selector: "clr-checkbox-wrapper,clr-toggle-wrapper" }, { kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i2.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i2.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i1.ActionBarComponent, selector: "vdr-action-bar" }, { kind: "component", type: i1.ActionBarLeftComponent, selector: "vdr-ab-left", inputs: ["grow"] }, { kind: "component", type: i1.ActionBarRightComponent, selector: "vdr-ab-right", inputs: ["grow"] }, { kind: "component", type: i1.ActionBarDropdownMenuComponent, selector: "vdr-action-bar-dropdown-menu", inputs: ["alwaysShow"] }, { kind: "component", type: i1.AssetsComponent, selector: "vdr-assets", inputs: ["assets", "featuredAsset", "compact", "updatePermissions", "multiSelect"], outputs: ["change"] }, { kind: "component", type: i1.ConfigurableInputComponent, selector: "vdr-configurable-input", inputs: ["operation", "operationDefinition", "readonly", "removable", "position", "hideDescription"], outputs: ["remove"] }, { kind: "component", type: i1.FormFieldComponent, selector: "vdr-form-field", inputs: ["label", "for", "tooltip", "errors", "readOnlyToggle"], outputs: ["readOnlyToggleChange"] }, { kind: "directive", type: i1.FormFieldControlDirective, selector: "input, textarea, select, vdr-currency-input" }, { kind: "component", type: i1.LanguageSelectorComponent, selector: "vdr-language-selector", inputs: ["currentLanguageCode", "availableLanguageCodes", "disabled"], outputs: ["languageCodeChange"] }, { kind: "component", type: i1.RichTextEditorComponent, selector: "vdr-rich-text-editor", inputs: ["label", "readonly"] }, { kind: "component", type: i1.DropdownComponent, selector: "vdr-dropdown", inputs: ["manualToggle"] }, { kind: "component", type: i1.DropdownMenuComponent, selector: "vdr-dropdown-menu", inputs: ["vdrPosition", "customClasses"] }, { kind: "directive", type: i1.DropdownTriggerDirective, selector: "[vdrDropdownTrigger]" }, { kind: "directive", type: i1.DropdownItemDirective, selector: "[vdrDropdownItem]" }, { kind: "directive", type: i1.IfPermissionsDirective, selector: "[vdrIfPermissions]", inputs: ["vdrIfPermissions", "vdrIfPermissionsElse"] }, { kind: "component", type: i1.ActionBarItemsComponent, selector: "vdr-action-bar-items" }, { kind: "directive", type: i1.DisabledDirective, selector: "[vdrDisabled]", inputs: ["vdrDisabled"] }, { kind: "component", type: i1.TabbedCustomFieldsComponent, selector: "vdr-tabbed-custom-fields", inputs: ["entityName", "customFields", "customFieldsFormGroup", "readonly", "compact", "showLabel"] }, { kind: "component", type: i1.CustomDetailComponentHostComponent, selector: "vdr-custom-detail-component-host", inputs: ["locationId", "entity$", "detailForm"] }, { kind: "component", type: i1.PageBlockComponent, selector: "vdr-page-block" }, { kind: "component", type: i1.PageEntityInfoComponent, selector: "vdr-page-entity-info", inputs: ["entity"] }, { kind: "component", type: i1.PageDetailLayoutComponent, selector: "vdr-page-detail-layout" }, { kind: "component", type: i1.PageDetailSidebarComponent, selector: "vdr-page-detail-sidebar" }, { kind: "component", type: i1.CardComponent, selector: "vdr-card", inputs: ["title", "paddingX"] }, { kind: "component", type: CollectionContentsComponent, selector: "vdr-collection-contents", inputs: ["collectionId", "parentId", "inheritFilters", "updatedFilters", "previewUpdatedFilters"] }, { kind: "pipe", type: i3$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }, { kind: "pipe", type: i1.HasPermissionPipe, name: "hasPermission" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
2021
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: CollectionDetailComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.DataService }, { token: i2.FormBuilder }, { token: i1.NotificationService }, { token: i1.ModalService }, { token: i1.LocalStorageService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2022
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: CollectionDetailComponent, isStandalone: false, selector: "vdr-collection-detail", viewQueries: [{ propertyName: "contentsComponent", first: true, predicate: ["collectionContents"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<vdr-page-block>\n <vdr-action-bar>\n <vdr-ab-left>\n <vdr-language-selector\n [disabled]=\"isNew$ | async\"\n [availableLanguageCodes]=\"availableLanguages$ | async\"\n [currentLanguageCode]=\"languageCode$ | async\"\n (languageCodeChange)=\"setLanguage($event)\"\n ></vdr-language-selector>\n </vdr-ab-left>\n <vdr-ab-right>\n <vdr-action-bar-items locationId=\"collection-detail\" />\n <button\n class=\"btn btn-primary\"\n *ngIf=\"isNew$ | async; else updateButton\"\n (click)=\"create()\"\n [disabled]=\"detailForm.invalid || detailForm.pristine\"\n >\n {{ 'common.create' | translate }}\n </button>\n <ng-template #updateButton>\n <button\n *vdrIfPermissions=\"updatePermission\"\n class=\"btn btn-primary\"\n (click)=\"save()\"\n [disabled]=\"(detailForm.invalid || detailForm.pristine) && !assetsChanged()\"\n >\n {{ 'common.update' | translate }}\n </button>\n </ng-template>\n <vdr-action-bar-dropdown-menu locationId=\"collection-detail\" />\n </vdr-ab-right>\n </vdr-action-bar>\n</vdr-page-block>\n<form class=\"form\" [formGroup]=\"detailForm\">\n <vdr-page-detail-layout>\n <vdr-page-detail-sidebar>\n <vdr-card>\n <vdr-form-field [label]=\"'catalog.visibility' | translate\" for=\"visibility\">\n <clr-toggle-wrapper>\n <input\n type=\"checkbox\"\n clrToggle\n formControlName=\"visible\"\n id=\"visibility\"\n [vdrDisabled]=\"!(updatePermission | hasPermission)\"\n />\n <label class=\"visible-toggle\">\n <ng-container *ngIf=\"detailForm.value.visible; else private\">{{\n 'catalog.public' | translate\n }}</ng-container>\n <ng-template #private>{{ 'catalog.private' | translate }}</ng-template>\n </label>\n </clr-toggle-wrapper>\n </vdr-form-field>\n </vdr-card>\n <vdr-card *ngIf=\"entity$ | async as entity\">\n <vdr-page-entity-info [entity]=\"entity\"></vdr-page-entity-info>\n </vdr-card>\n </vdr-page-detail-sidebar>\n\n <vdr-page-block *ngIf=\"entity$ | async as entity\"\n ><nav role=\"navigation\">\n <ul class=\"collection-breadcrumbs\">\n <li *ngFor=\"let breadcrumb of entity.breadcrumbs; let isFirst = first; let isLast = last\">\n <a [routerLink]=\"['/catalog/collections']\" *ngIf=\"isFirst\">{{\n 'catalog.root-collection' | translate\n }}</a>\n <a\n [routerLink]=\"['/catalog/collections', breadcrumb.id]\"\n *ngIf=\"!isFirst && !isLast\"\n >{{ breadcrumb.name | translate }}</a\n >\n <ng-container *ngIf=\"isLast\">{{ breadcrumb.name | translate }}</ng-container>\n </li>\n </ul>\n </nav>\n </vdr-page-block>\n\n <vdr-page-block>\n <vdr-card>\n <div class=\"form-grid\">\n <vdr-form-field [label]=\"'common.name' | translate\" for=\"name\">\n <input\n id=\"name\"\n type=\"text\"\n formControlName=\"name\"\n [readonly]=\"!(updatePermission | hasPermission)\"\n (input)=\"updateSlug($event.target.value)\"\n />\n </vdr-form-field>\n <vdr-form-field\n [label]=\"'catalog.slug' | translate\"\n for=\"slug\"\n [errors]=\"{ pattern: ('catalog.slug-pattern-error' | translate) }\"\n >\n <input\n id=\"slug\"\n type=\"text\"\n formControlName=\"slug\"\n [readonly]=\"!(updatePermission | hasPermission)\"\n />\n </vdr-form-field>\n <vdr-form-field\n class=\"form-grid-span\"\n [label]=\"'common.description' | translate\"\n for=\"slug\"\n >\n <vdr-rich-text-editor\n formControlName=\"description\"\n [readonly]=\"!(updatePermission | hasPermission)\"\n ></vdr-rich-text-editor>\n </vdr-form-field>\n </div>\n </vdr-card>\n <vdr-card\n formGroupName=\"customFields\"\n *ngIf=\"customFields.length\"\n [title]=\"'common.custom-fields' | translate\"\n >\n <vdr-tabbed-custom-fields\n entityName=\"Collection\"\n [customFields]=\"customFields\"\n [customFieldsFormGroup]=\"detailForm.get('customFields')\"\n [readonly]=\"!(updatePermission | hasPermission)\"\n ></vdr-tabbed-custom-fields>\n </vdr-card>\n <vdr-custom-detail-component-host\n locationId=\"collection-detail\"\n [entity$]=\"entity$\"\n [detailForm]=\"detailForm\"\n ></vdr-custom-detail-component-host>\n <vdr-card [title]=\"'catalog.assets' | translate\">\n <vdr-assets\n [assets]=\"entity?.assets\"\n [featuredAsset]=\"entity?.featuredAsset\"\n [updatePermissions]=\"updatePermission\"\n (change)=\"assetChanges = $event\"\n ></vdr-assets>\n </vdr-card>\n <vdr-card [title]=\"'catalog.filters' | translate\">\n <vdr-form-field [label]=\"'catalog.filter-inheritance' | translate\" for=\"inheritFilters\">\n <clr-toggle-wrapper>\n <input\n type=\"checkbox\"\n clrToggle\n formControlName=\"inheritFilters\"\n id=\"inheritFilters\"\n [vdrDisabled]=\"!(updatePermission | hasPermission)\"\n />\n <label class=\"visible-toggle\">\n <ng-container *ngIf=\"detailForm.value.inheritFilters; else noInherit\">{{\n 'catalog.inherit-filters-from-parent' | translate\n }}</ng-container>\n <ng-template #noInherit>{{\n 'catalog.do-not-inherit-filters' | translate\n }}</ng-template>\n </label>\n </clr-toggle-wrapper>\n </vdr-form-field>\n <div formArrayName=\"filters\">\n <ng-container *ngFor=\"let filter of filters; index as i; trackBy: trackByFn\">\n <vdr-configurable-input\n (remove)=\"removeFilter(i)\"\n [position]=\"i\"\n [operation]=\"filter\"\n [operationDefinition]=\"getFilterDefinition(filter)\"\n [formControlName]=\"i\"\n [readonly]=\"!(updatePermission | hasPermission)\"\n ></vdr-configurable-input>\n </ng-container>\n </div>\n <div *vdrIfPermissions=\"updatePermission\">\n <vdr-dropdown>\n <button class=\"btn btn-outline\" vdrDropdownTrigger>\n <clr-icon shape=\"plus\"></clr-icon>\n <span>{{ 'marketing.add-condition' | translate }}</span>\n <clr-icon shape=\"ellipsis-vertical\"></clr-icon>\n </button>\n <vdr-dropdown-menu vdrPosition=\"bottom-left\">\n <button\n *ngFor=\"let filter of allFilters\"\n type=\"button\"\n vdrDropdownItem\n (click)=\"addFilter(filter)\"\n >\n {{ filter.description }}\n </button>\n </vdr-dropdown-menu>\n </vdr-dropdown>\n </div>\n </vdr-card>\n\n <vdr-card [title]=\"'common.contents' | translate\" [paddingX]=\"false\">\n <vdr-collection-contents\n [collectionId]=\"id\"\n [parentId]=\"parentId$ | async\"\n [updatedFilters]=\"updatedFilters$ | async\"\n [inheritFilters]=\"inheritFilters$ | async\"\n [previewUpdatedFilters]=\"livePreview\"\n #collectionContents\n >\n <ng-template let-count>\n <div class=\"ml-3\">\n <div class=\"contents-title\">\n {{ 'catalog.collection-contents' | translate }} ({{\n 'common.results-count' | translate : { count: count }\n }})\n </div>\n <clr-checkbox-wrapper [class.disabled]=\"detailForm.get('filters')?.pristine\">\n <input\n type=\"checkbox\"\n clrCheckbox\n [ngModelOptions]=\"{ standalone: true }\"\n [disabled]=\"detailForm.get('filters')?.pristine\"\n [ngModel]=\"livePreview\"\n (ngModelChange)=\"toggleLivePreview()\"\n />\n <label>{{ 'catalog.live-preview-contents' | translate }}</label>\n </clr-checkbox-wrapper>\n </div>\n </ng-template>\n </vdr-collection-contents>\n </vdr-card>\n </vdr-page-block>\n </vdr-page-detail-layout>\n</form>\n", styles: ["@charset \"UTF-8\";.visible-toggle{margin-top:-3px!important}clr-checkbox-wrapper{transition:opacity .3s}clr-checkbox-wrapper.disabled{opacity:.5}.collection-breadcrumbs{list-style-type:none;background-color:var(--color-component-bg-200);padding:2px 6px;margin-bottom:6px;border-radius:var(--clr-global-borderradius)}.collection-breadcrumbs li{font-size:.65rem;display:inline-block;margin-inline-end:10px}.collection-breadcrumbs li:last-child{font-weight:600}.collection-breadcrumbs li:not(:last-child):after{content:\"\\203a\";top:0;color:var(--color-grey-400);margin-inline-start:10px}\n"], dependencies: [{ kind: "directive", type: i3.ClrIconCustomTag, selector: "clr-icon" }, { kind: "directive", type: i3.ClrLabel, selector: "label", inputs: ["id", "for"] }, { kind: "directive", type: i3.ClrCheckbox, selector: "[clrCheckbox],[clrToggle]" }, { kind: "component", type: i3.ClrCheckboxWrapper, selector: "clr-checkbox-wrapper,clr-toggle-wrapper" }, { kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i2.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i2.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i1.ActionBarComponent, selector: "vdr-action-bar" }, { kind: "component", type: i1.ActionBarLeftComponent, selector: "vdr-ab-left", inputs: ["grow"] }, { kind: "component", type: i1.ActionBarRightComponent, selector: "vdr-ab-right", inputs: ["grow"] }, { kind: "component", type: i1.ActionBarDropdownMenuComponent, selector: "vdr-action-bar-dropdown-menu", inputs: ["alwaysShow"] }, { kind: "component", type: i1.AssetsComponent, selector: "vdr-assets", inputs: ["assets", "featuredAsset", "compact", "updatePermissions", "multiSelect"], outputs: ["change"] }, { kind: "component", type: i1.ConfigurableInputComponent, selector: "vdr-configurable-input", inputs: ["operation", "operationDefinition", "readonly", "removable", "position", "hideDescription"], outputs: ["remove"] }, { kind: "component", type: i1.FormFieldComponent, selector: "vdr-form-field", inputs: ["label", "for", "tooltip", "errors", "readOnlyToggle"], outputs: ["readOnlyToggleChange"] }, { kind: "directive", type: i1.FormFieldControlDirective, selector: "input, textarea, select, vdr-currency-input" }, { kind: "component", type: i1.LanguageSelectorComponent, selector: "vdr-language-selector", inputs: ["currentLanguageCode", "availableLanguageCodes", "disabled"], outputs: ["languageCodeChange"] }, { kind: "component", type: i1.RichTextEditorComponent, selector: "vdr-rich-text-editor", inputs: ["label", "readonly"] }, { kind: "component", type: i1.DropdownComponent, selector: "vdr-dropdown", inputs: ["manualToggle"] }, { kind: "component", type: i1.DropdownMenuComponent, selector: "vdr-dropdown-menu", inputs: ["vdrPosition", "customClasses"] }, { kind: "directive", type: i1.DropdownTriggerDirective, selector: "[vdrDropdownTrigger]" }, { kind: "directive", type: i1.DropdownItemDirective, selector: "[vdrDropdownItem]" }, { kind: "directive", type: i1.IfPermissionsDirective, selector: "[vdrIfPermissions]", inputs: ["vdrIfPermissions", "vdrIfPermissionsElse"] }, { kind: "component", type: i1.ActionBarItemsComponent, selector: "vdr-action-bar-items" }, { kind: "directive", type: i1.DisabledDirective, selector: "[vdrDisabled]", inputs: ["vdrDisabled"] }, { kind: "component", type: i1.TabbedCustomFieldsComponent, selector: "vdr-tabbed-custom-fields", inputs: ["entityName", "customFields", "customFieldsFormGroup", "readonly", "compact", "showLabel"] }, { kind: "component", type: i1.CustomDetailComponentHostComponent, selector: "vdr-custom-detail-component-host", inputs: ["locationId", "entity$", "detailForm"] }, { kind: "component", type: i1.PageBlockComponent, selector: "vdr-page-block" }, { kind: "component", type: i1.PageEntityInfoComponent, selector: "vdr-page-entity-info", inputs: ["entity"] }, { kind: "component", type: i1.PageDetailLayoutComponent, selector: "vdr-page-detail-layout" }, { kind: "component", type: i1.PageDetailSidebarComponent, selector: "vdr-page-detail-sidebar" }, { kind: "component", type: i1.CardComponent, selector: "vdr-card", inputs: ["title", "paddingX"] }, { kind: "component", type: CollectionContentsComponent, selector: "vdr-collection-contents", inputs: ["collectionId", "parentId", "inheritFilters", "updatedFilters", "previewUpdatedFilters"] }, { kind: "pipe", type: i3$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }, { kind: "pipe", type: i1.HasPermissionPipe, name: "hasPermission" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
2023
2023
|
}
|
|
2024
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
2024
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: CollectionDetailComponent, decorators: [{
|
|
2025
2025
|
type: Component,
|
|
2026
2026
|
args: [{ selector: 'vdr-collection-detail', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<vdr-page-block>\n <vdr-action-bar>\n <vdr-ab-left>\n <vdr-language-selector\n [disabled]=\"isNew$ | async\"\n [availableLanguageCodes]=\"availableLanguages$ | async\"\n [currentLanguageCode]=\"languageCode$ | async\"\n (languageCodeChange)=\"setLanguage($event)\"\n ></vdr-language-selector>\n </vdr-ab-left>\n <vdr-ab-right>\n <vdr-action-bar-items locationId=\"collection-detail\" />\n <button\n class=\"btn btn-primary\"\n *ngIf=\"isNew$ | async; else updateButton\"\n (click)=\"create()\"\n [disabled]=\"detailForm.invalid || detailForm.pristine\"\n >\n {{ 'common.create' | translate }}\n </button>\n <ng-template #updateButton>\n <button\n *vdrIfPermissions=\"updatePermission\"\n class=\"btn btn-primary\"\n (click)=\"save()\"\n [disabled]=\"(detailForm.invalid || detailForm.pristine) && !assetsChanged()\"\n >\n {{ 'common.update' | translate }}\n </button>\n </ng-template>\n <vdr-action-bar-dropdown-menu locationId=\"collection-detail\" />\n </vdr-ab-right>\n </vdr-action-bar>\n</vdr-page-block>\n<form class=\"form\" [formGroup]=\"detailForm\">\n <vdr-page-detail-layout>\n <vdr-page-detail-sidebar>\n <vdr-card>\n <vdr-form-field [label]=\"'catalog.visibility' | translate\" for=\"visibility\">\n <clr-toggle-wrapper>\n <input\n type=\"checkbox\"\n clrToggle\n formControlName=\"visible\"\n id=\"visibility\"\n [vdrDisabled]=\"!(updatePermission | hasPermission)\"\n />\n <label class=\"visible-toggle\">\n <ng-container *ngIf=\"detailForm.value.visible; else private\">{{\n 'catalog.public' | translate\n }}</ng-container>\n <ng-template #private>{{ 'catalog.private' | translate }}</ng-template>\n </label>\n </clr-toggle-wrapper>\n </vdr-form-field>\n </vdr-card>\n <vdr-card *ngIf=\"entity$ | async as entity\">\n <vdr-page-entity-info [entity]=\"entity\"></vdr-page-entity-info>\n </vdr-card>\n </vdr-page-detail-sidebar>\n\n <vdr-page-block *ngIf=\"entity$ | async as entity\"\n ><nav role=\"navigation\">\n <ul class=\"collection-breadcrumbs\">\n <li *ngFor=\"let breadcrumb of entity.breadcrumbs; let isFirst = first; let isLast = last\">\n <a [routerLink]=\"['/catalog/collections']\" *ngIf=\"isFirst\">{{\n 'catalog.root-collection' | translate\n }}</a>\n <a\n [routerLink]=\"['/catalog/collections', breadcrumb.id]\"\n *ngIf=\"!isFirst && !isLast\"\n >{{ breadcrumb.name | translate }}</a\n >\n <ng-container *ngIf=\"isLast\">{{ breadcrumb.name | translate }}</ng-container>\n </li>\n </ul>\n </nav>\n </vdr-page-block>\n\n <vdr-page-block>\n <vdr-card>\n <div class=\"form-grid\">\n <vdr-form-field [label]=\"'common.name' | translate\" for=\"name\">\n <input\n id=\"name\"\n type=\"text\"\n formControlName=\"name\"\n [readonly]=\"!(updatePermission | hasPermission)\"\n (input)=\"updateSlug($event.target.value)\"\n />\n </vdr-form-field>\n <vdr-form-field\n [label]=\"'catalog.slug' | translate\"\n for=\"slug\"\n [errors]=\"{ pattern: ('catalog.slug-pattern-error' | translate) }\"\n >\n <input\n id=\"slug\"\n type=\"text\"\n formControlName=\"slug\"\n [readonly]=\"!(updatePermission | hasPermission)\"\n />\n </vdr-form-field>\n <vdr-form-field\n class=\"form-grid-span\"\n [label]=\"'common.description' | translate\"\n for=\"slug\"\n >\n <vdr-rich-text-editor\n formControlName=\"description\"\n [readonly]=\"!(updatePermission | hasPermission)\"\n ></vdr-rich-text-editor>\n </vdr-form-field>\n </div>\n </vdr-card>\n <vdr-card\n formGroupName=\"customFields\"\n *ngIf=\"customFields.length\"\n [title]=\"'common.custom-fields' | translate\"\n >\n <vdr-tabbed-custom-fields\n entityName=\"Collection\"\n [customFields]=\"customFields\"\n [customFieldsFormGroup]=\"detailForm.get('customFields')\"\n [readonly]=\"!(updatePermission | hasPermission)\"\n ></vdr-tabbed-custom-fields>\n </vdr-card>\n <vdr-custom-detail-component-host\n locationId=\"collection-detail\"\n [entity$]=\"entity$\"\n [detailForm]=\"detailForm\"\n ></vdr-custom-detail-component-host>\n <vdr-card [title]=\"'catalog.assets' | translate\">\n <vdr-assets\n [assets]=\"entity?.assets\"\n [featuredAsset]=\"entity?.featuredAsset\"\n [updatePermissions]=\"updatePermission\"\n (change)=\"assetChanges = $event\"\n ></vdr-assets>\n </vdr-card>\n <vdr-card [title]=\"'catalog.filters' | translate\">\n <vdr-form-field [label]=\"'catalog.filter-inheritance' | translate\" for=\"inheritFilters\">\n <clr-toggle-wrapper>\n <input\n type=\"checkbox\"\n clrToggle\n formControlName=\"inheritFilters\"\n id=\"inheritFilters\"\n [vdrDisabled]=\"!(updatePermission | hasPermission)\"\n />\n <label class=\"visible-toggle\">\n <ng-container *ngIf=\"detailForm.value.inheritFilters; else noInherit\">{{\n 'catalog.inherit-filters-from-parent' | translate\n }}</ng-container>\n <ng-template #noInherit>{{\n 'catalog.do-not-inherit-filters' | translate\n }}</ng-template>\n </label>\n </clr-toggle-wrapper>\n </vdr-form-field>\n <div formArrayName=\"filters\">\n <ng-container *ngFor=\"let filter of filters; index as i; trackBy: trackByFn\">\n <vdr-configurable-input\n (remove)=\"removeFilter(i)\"\n [position]=\"i\"\n [operation]=\"filter\"\n [operationDefinition]=\"getFilterDefinition(filter)\"\n [formControlName]=\"i\"\n [readonly]=\"!(updatePermission | hasPermission)\"\n ></vdr-configurable-input>\n </ng-container>\n </div>\n <div *vdrIfPermissions=\"updatePermission\">\n <vdr-dropdown>\n <button class=\"btn btn-outline\" vdrDropdownTrigger>\n <clr-icon shape=\"plus\"></clr-icon>\n <span>{{ 'marketing.add-condition' | translate }}</span>\n <clr-icon shape=\"ellipsis-vertical\"></clr-icon>\n </button>\n <vdr-dropdown-menu vdrPosition=\"bottom-left\">\n <button\n *ngFor=\"let filter of allFilters\"\n type=\"button\"\n vdrDropdownItem\n (click)=\"addFilter(filter)\"\n >\n {{ filter.description }}\n </button>\n </vdr-dropdown-menu>\n </vdr-dropdown>\n </div>\n </vdr-card>\n\n <vdr-card [title]=\"'common.contents' | translate\" [paddingX]=\"false\">\n <vdr-collection-contents\n [collectionId]=\"id\"\n [parentId]=\"parentId$ | async\"\n [updatedFilters]=\"updatedFilters$ | async\"\n [inheritFilters]=\"inheritFilters$ | async\"\n [previewUpdatedFilters]=\"livePreview\"\n #collectionContents\n >\n <ng-template let-count>\n <div class=\"ml-3\">\n <div class=\"contents-title\">\n {{ 'catalog.collection-contents' | translate }} ({{\n 'common.results-count' | translate : { count: count }\n }})\n </div>\n <clr-checkbox-wrapper [class.disabled]=\"detailForm.get('filters')?.pristine\">\n <input\n type=\"checkbox\"\n clrCheckbox\n [ngModelOptions]=\"{ standalone: true }\"\n [disabled]=\"detailForm.get('filters')?.pristine\"\n [ngModel]=\"livePreview\"\n (ngModelChange)=\"toggleLivePreview()\"\n />\n <label>{{ 'catalog.live-preview-contents' | translate }}</label>\n </clr-checkbox-wrapper>\n </div>\n </ng-template>\n </vdr-collection-contents>\n </vdr-card>\n </vdr-page-block>\n </vdr-page-detail-layout>\n</form>\n", styles: ["@charset \"UTF-8\";.visible-toggle{margin-top:-3px!important}clr-checkbox-wrapper{transition:opacity .3s}clr-checkbox-wrapper.disabled{opacity:.5}.collection-breadcrumbs{list-style-type:none;background-color:var(--color-component-bg-200);padding:2px 6px;margin-bottom:6px;border-radius:var(--clr-global-borderradius)}.collection-breadcrumbs li{font-size:.65rem;display:inline-block;margin-inline-end:10px}.collection-breadcrumbs li:last-child{font-weight:600}.collection-breadcrumbs li:not(:last-child):after{content:\"\\203a\";top:0;color:var(--color-grey-400);margin-inline-start:10px}\n"] }]
|
|
2027
2027
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1.DataService }, { type: i2.FormBuilder }, { type: i1.NotificationService }, { type: i1.ModalService }, { type: i1.LocalStorageService }], propDecorators: { contentsComponent: [{
|
|
@@ -2036,10 +2036,10 @@ class CollectionBreadcrumbPipe {
|
|
|
2036
2036
|
transform(value) {
|
|
2037
2037
|
return value?.breadcrumbs.slice(1, -1);
|
|
2038
2038
|
}
|
|
2039
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
2040
|
-
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.
|
|
2039
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: CollectionBreadcrumbPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
|
|
2040
|
+
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.15", ngImport: i0, type: CollectionBreadcrumbPipe, isStandalone: false, name: "collectionBreadcrumb" }); }
|
|
2041
2041
|
}
|
|
2042
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
2042
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: CollectionBreadcrumbPipe, decorators: [{
|
|
2043
2043
|
type: Pipe,
|
|
2044
2044
|
args: [{
|
|
2045
2045
|
name: 'collectionBreadcrumb',
|
|
@@ -2128,10 +2128,10 @@ class MoveCollectionsDialogComponent {
|
|
|
2128
2128
|
}
|
|
2129
2129
|
this.expandedIds$.next(expandedIds);
|
|
2130
2130
|
}
|
|
2131
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
2132
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
2131
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: MoveCollectionsDialogComponent, deps: [{ token: i1.DataService }, { token: i1.I18nService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2132
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: MoveCollectionsDialogComponent, isStandalone: false, selector: "vdr-move-collections-dialog", ngImport: i0, template: "<ng-template vdrDialogTitle>\n {{ 'catalog.move-collections' | translate }}\n</ng-template>\n<vdr-collection-data-table\n class=\"mt-2\"\n id=\"move-collection-list\"\n [items]=\"items$ | async\"\n [subCollections]=\"subCollections$ | async\"\n [itemsPerPage]=\"itemsPerPage$ | async\"\n [totalItems]=\"totalItems$ | async\"\n [currentPage]=\"currentPage$ | async\"\n (pageChange)=\"currentPage$.next($event)\"\n (itemsPerPageChange)=\"itemsPerPage$.next($event)\"\n>\n <vdr-dt2-search\n [searchTermControl]=\"searchTermControl\"\n [searchTermPlaceholder]=\"'common.search-by-name' | translate\"\n ></vdr-dt2-search>\n <vdr-dt2-column [heading]=\"'common.id' | translate\" id=\"id\" [hiddenByDefault]=\"true\">\n <ng-template let-collection=\"item\">\n {{ collection.id }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.name' | translate\" id=\"name\" [optional]=\"false\">\n <ng-template let-collection=\"item\" let-depth=\"depth\">\n <div [ngClass]=\"'indent-' + depth\"></div>\n <clr-icon\n class=\"child-arrow\"\n [class.transparent]=\"depth === 0\"\n shape=\"child-arrow\"\n *ngIf=\"!collection.children?.length && collection.parentId !== '__'\"\n ></clr-icon>\n <button\n class=\"icon-button folder-button\"\n *ngIf=\"collection.children?.length\"\n (click)=\"toggleExpanded(collection)\"\n >\n <clr-icon shape=\"folder\" *ngIf=\"!expandedIds.includes(collection.id)\"></clr-icon>\n <clr-icon shape=\"folder-open\" *ngIf=\"expandedIds.includes(collection.id)\"></clr-icon>\n </button>\n <button class=\"icon-button folder-button\" *ngIf=\"collection.parentId === '__'\" disabled>\n <clr-icon shape=\"folder\" class=\"is-solid\"></clr-icon>\n </button>\n <button class=\"button-ghost\" (click)=\"resolveWith(collection)\">\n <span>{{ 'catalog.move-collection-to' | translate : {name: collection.name} }}</span>\n </button>\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.breadcrumb' | translate\" id=\"breadcrumb\">\n <ng-template let-collection=\"item\">\n <div class=\"breadcrumb\">\n <ng-container *ngIf=\"collection | collectionBreadcrumb as breadcrumbs\">\n <ng-container *ngIf=\"breadcrumbs.length\">\n <div *ngFor=\"let item of breadcrumbs\">\n <span class=\"separator\">/</span>{{ item.name }}\n </div>\n </ng-container>\n <span class=\"separator\" *ngIf=\"!breadcrumbs.length\">/</span>\n </ng-container>\n </div>\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.slug' | translate\" id=\"slug\">\n <ng-template let-collection=\"item\">\n {{ collection.slug }}\n </ng-template>\n </vdr-dt2-column>\n</vdr-collection-data-table>\n", styles: ["", ":host{--indent-spacing: 18px}.indent-1{padding-inline-start:var(--indent-spacing)}.indent-2{padding-inline-start:calc(var(--indent-spacing) * 2)}.indent-3{padding-inline-start:calc(var(--indent-spacing) * 3)}.indent-4,.indent-5,.indent-6,.indent-7,.indent-8,.indent-9{padding-inline-start:calc(var(--indent-spacing) * 4)}.child-arrow{margin:1px 6px}.child-arrow.transparent{opacity:0}.breadcrumb{display:flex}.separator{color:var(--color-weight-500);margin:0 3px}\n"], dependencies: [{ kind: "directive", type: i3.ClrIconCustomTag, selector: "clr-icon" }, { kind: "directive", type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.DialogTitleDirective, selector: "[vdrDialogTitle]" }, { kind: "component", type: i1.DataTable2ColumnComponent, selector: "vdr-dt2-column", inputs: ["id", "expand", "heading", "align", "sort", "optional", "hiddenByDefault", "orderable"], exportAs: ["row"] }, { kind: "component", type: i1.DataTable2SearchComponent, selector: "vdr-dt2-search", inputs: ["searchTermControl", "searchTermPlaceholder"] }, { kind: "component", type: CollectionDataTableComponent, selector: "vdr-collection-data-table", inputs: ["subCollections"], outputs: ["changeOrder"] }, { kind: "pipe", type: i3$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }, { kind: "pipe", type: CollectionBreadcrumbPipe, name: "collectionBreadcrumb" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
2133
2133
|
}
|
|
2134
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
2134
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: MoveCollectionsDialogComponent, decorators: [{
|
|
2135
2135
|
type: Component,
|
|
2136
2136
|
args: [{ selector: 'vdr-move-collections-dialog', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<ng-template vdrDialogTitle>\n {{ 'catalog.move-collections' | translate }}\n</ng-template>\n<vdr-collection-data-table\n class=\"mt-2\"\n id=\"move-collection-list\"\n [items]=\"items$ | async\"\n [subCollections]=\"subCollections$ | async\"\n [itemsPerPage]=\"itemsPerPage$ | async\"\n [totalItems]=\"totalItems$ | async\"\n [currentPage]=\"currentPage$ | async\"\n (pageChange)=\"currentPage$.next($event)\"\n (itemsPerPageChange)=\"itemsPerPage$.next($event)\"\n>\n <vdr-dt2-search\n [searchTermControl]=\"searchTermControl\"\n [searchTermPlaceholder]=\"'common.search-by-name' | translate\"\n ></vdr-dt2-search>\n <vdr-dt2-column [heading]=\"'common.id' | translate\" id=\"id\" [hiddenByDefault]=\"true\">\n <ng-template let-collection=\"item\">\n {{ collection.id }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.name' | translate\" id=\"name\" [optional]=\"false\">\n <ng-template let-collection=\"item\" let-depth=\"depth\">\n <div [ngClass]=\"'indent-' + depth\"></div>\n <clr-icon\n class=\"child-arrow\"\n [class.transparent]=\"depth === 0\"\n shape=\"child-arrow\"\n *ngIf=\"!collection.children?.length && collection.parentId !== '__'\"\n ></clr-icon>\n <button\n class=\"icon-button folder-button\"\n *ngIf=\"collection.children?.length\"\n (click)=\"toggleExpanded(collection)\"\n >\n <clr-icon shape=\"folder\" *ngIf=\"!expandedIds.includes(collection.id)\"></clr-icon>\n <clr-icon shape=\"folder-open\" *ngIf=\"expandedIds.includes(collection.id)\"></clr-icon>\n </button>\n <button class=\"icon-button folder-button\" *ngIf=\"collection.parentId === '__'\" disabled>\n <clr-icon shape=\"folder\" class=\"is-solid\"></clr-icon>\n </button>\n <button class=\"button-ghost\" (click)=\"resolveWith(collection)\">\n <span>{{ 'catalog.move-collection-to' | translate : {name: collection.name} }}</span>\n </button>\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.breadcrumb' | translate\" id=\"breadcrumb\">\n <ng-template let-collection=\"item\">\n <div class=\"breadcrumb\">\n <ng-container *ngIf=\"collection | collectionBreadcrumb as breadcrumbs\">\n <ng-container *ngIf=\"breadcrumbs.length\">\n <div *ngFor=\"let item of breadcrumbs\">\n <span class=\"separator\">/</span>{{ item.name }}\n </div>\n </ng-container>\n <span class=\"separator\" *ngIf=\"!breadcrumbs.length\">/</span>\n </ng-container>\n </div>\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.slug' | translate\" id=\"slug\">\n <ng-template let-collection=\"item\">\n {{ collection.slug }}\n </ng-template>\n </vdr-dt2-column>\n</vdr-collection-data-table>\n", styles: [":host{--indent-spacing: 18px}.indent-1{padding-inline-start:var(--indent-spacing)}.indent-2{padding-inline-start:calc(var(--indent-spacing) * 2)}.indent-3{padding-inline-start:calc(var(--indent-spacing) * 3)}.indent-4,.indent-5,.indent-6,.indent-7,.indent-8,.indent-9{padding-inline-start:calc(var(--indent-spacing) * 4)}.child-arrow{margin:1px 6px}.child-arrow.transparent{opacity:0}.breadcrumb{display:flex}.separator{color:var(--color-weight-500);margin:0 3px}\n"] }]
|
|
2137
2137
|
}], ctorParameters: () => [{ type: i1.DataService }, { type: i1.I18nService }] });
|
|
@@ -2364,10 +2364,10 @@ class CollectionListComponent extends TypedBaseListComponent {
|
|
|
2364
2364
|
relativeTo: this.route,
|
|
2365
2365
|
});
|
|
2366
2366
|
}
|
|
2367
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
2368
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: CollectionListComponent, isStandalone: false, selector: "vdr-collection-list", usesInheritance: true, ngImport: i0, template: "<vdr-page-block>\n <vdr-action-bar>\n <vdr-ab-left>\n <vdr-language-selector\n [availableLanguageCodes]=\"availableLanguages$ | async\"\n [currentLanguageCode]=\"contentLanguage$ | async\"\n (languageCodeChange)=\"setLanguage($event)\"\n ></vdr-language-selector>\n </vdr-ab-left>\n <vdr-ab-right>\n <vdr-action-bar-items locationId=\"collection-list\" />\n <a\n class=\"btn btn-primary\"\n *vdrIfPermissions=\"['CreateCatalog', 'CreateCollection']\"\n [routerLink]=\"['./create']\"\n >\n <clr-icon shape=\"plus\"></clr-icon>\n {{ 'catalog.create-new-collection' | translate }}\n </a>\n <vdr-action-bar-dropdown-menu locationId=\"collection-list\" />\n </vdr-ab-right>\n </vdr-action-bar>\n</vdr-page-block>\n<vdr-split-view [rightPanelOpen]=\"activeCollectionId$ | async\" (closeClicked)=\"closeContents()\">\n <ng-template vdrSplitViewLeft>\n <vdr-collection-data-table\n class=\"mt-2\"\n [id]=\"dataTableListId\"\n [items]=\"items$ | async\"\n [subCollections]=\"subCollections$ | async\"\n [itemsPerPage]=\"itemsPerPage$ | async\"\n [totalItems]=\"totalItems$ | async\"\n [currentPage]=\"currentPage$ | async\"\n [filters]=\"filters\"\n [activeIndex]=\"activeCollectionIndex$ | async\"\n (pageChange)=\"setPageNumber($event)\"\n (itemsPerPageChange)=\"setItemsPerPage($event)\"\n (changeOrder)=\"onRearrange($event)\"\n (visibleColumnsChange)=\"setVisibleColumns($event)\"\n >\n <vdr-bulk-action-menu\n locationId=\"collection-list\"\n [hostComponent]=\"this\"\n [selectionManager]=\"selectionManager\"\n ></vdr-bulk-action-menu>\n <vdr-dt2-search\n [searchTermControl]=\"searchTermControl\"\n [searchTermPlaceholder]=\"'common.search-by-name' | translate\"\n ></vdr-dt2-search>\n <vdr-dt2-column [heading]=\"'common.id' | translate\" id=\"id\" [hiddenByDefault]=\"true\">\n <ng-template let-collection=\"item\">\n {{ collection.id }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column\n [heading]=\"'common.created-at' | translate\" id=\"created-at\"\n [hiddenByDefault]=\"true\"\n [sort]=\"sorts.get('createdAt')\"\n >\n <ng-template let-collection=\"item\">\n {{ collection.createdAt | localeDate : 'short' }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column\n [heading]=\"'common.updated-at' | translate\" id=\"updated-at\"\n [hiddenByDefault]=\"true\"\n [sort]=\"sorts.get('updatedAt')\"\n >\n <ng-template let-collection=\"item\">\n {{ collection.updatedAt | localeDate : 'short' }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column\n [heading]=\"'common.position' | translate\" id=\"position\"\n [hiddenByDefault]=\"true\"\n [sort]=\"sorts.get('position')\"\n >\n <ng-template let-collection=\"item\">\n {{ collection.position }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column\n [heading]=\"'common.name' | translate\" id=\"name\"\n [optional]=\"false\"\n [sort]=\"sorts.get('name')\"\n >\n <ng-template let-collection=\"item\" let-depth=\"depth\">\n <div [ngClass]=\"'indent-' + depth\"></div>\n <clr-icon\n class=\"child-arrow\"\n [class.transparent]=\"depth === 0\"\n shape=\"child-arrow\"\n *ngIf=\"!collection.children?.length\"\n ></clr-icon>\n <button\n class=\"icon-button folder-button\"\n *ngIf=\"collection.children?.length\"\n (click)=\"toggleExpanded(collection)\"\n >\n <clr-icon shape=\"folder\" *ngIf=\"!expandedIds.includes(collection.id)\"></clr-icon>\n <clr-icon shape=\"folder-open\" *ngIf=\"expandedIds.includes(collection.id)\"></clr-icon>\n </button>\n <a class=\"button-ghost\" [routerLink]=\"['./', collection.id]\"\n ><span>{{ collection.name }}</span>\n <clr-icon shape=\"arrow right\"></clr-icon>\n </a>\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.breadcrumb' | translate\" id=\"breadcrumb\">\n <ng-template let-collection=\"item\">\n <div class=\"breadcrumb\">\n <ng-container *ngIf=\"collection | collectionBreadcrumb as breadcrumbs\">\n <ng-container *ngIf=\"breadcrumbs.length\">\n <div *ngFor=\"let item of breadcrumbs\">\n <span class=\"separator\">/</span>{{ item.name }}\n </div>\n </ng-container>\n <span class=\"separator\" *ngIf=\"!breadcrumbs.length\">/</span>\n </ng-container>\n </div>\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.slug' | translate\" id=\"slug\" [sort]=\"sorts.get('slug')\">\n <ng-template let-collection=\"item\">\n {{ collection.slug }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.visibility' | translate\" id=\"visibility\">\n <ng-template let-collection=\"item\">\n <vdr-chip *ngIf=\"collection.isPrivate\" colorType=\"warning\">{{\n 'common.private' | translate\n }}</vdr-chip>\n <vdr-chip *ngIf=\"!collection.isPrivate\" colorType=\"success\">{{\n 'common.public' | translate\n }}</vdr-chip>\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.view-contents' | translate\" id=\"view-contents\" [optional]=\"false\">\n <ng-template let-collection=\"item\">\n <a\n class=\"button-small bg-weight-150\"\n [routerLink]=\"['./', { contents: collection.id }]\"\n [queryParams]=\"{ contentsPage: 1 }\"\n queryParamsHandling=\"merge\"\n >\n <span>{{ 'common.view-contents' | translate }}</span>\n <clr-icon shape=\"file-group\"></clr-icon>\n </a>\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-custom-field-column\n *ngFor=\"let customField of customFields\"\n [customField]=\"customField\"\n [sorts]=\"sorts\"\n />\n </vdr-collection-data-table>\n </ng-template>\n <ng-template vdrSplitViewRight [splitViewTitle]=\"activeCollectionTitle$ | async\">\n <ng-container *ngIf=\"activeCollectionId$ | async as activeGroup\">\n <vdr-collection-contents [collectionId]=\"activeCollectionId$ | async\"></vdr-collection-contents>\n </ng-container>\n </ng-template>\n</vdr-split-view>\n", styles: ["", ":host{--indent-spacing: 18px}.indent-1{padding-inline-start:var(--indent-spacing)}.indent-2{padding-inline-start:calc(var(--indent-spacing) * 2)}.indent-3{padding-inline-start:calc(var(--indent-spacing) * 3)}.indent-4,.indent-5,.indent-6,.indent-7,.indent-8,.indent-9{padding-inline-start:calc(var(--indent-spacing) * 4)}.child-arrow{margin:1px 6px}.child-arrow.transparent{opacity:0}.breadcrumb{display:flex}.separator{color:var(--color-weight-500);margin:0 3px}\n"], dependencies: [{ kind: "directive", type: i3.ClrIconCustomTag, selector: "clr-icon" }, { kind: "directive", type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i1.ActionBarComponent, selector: "vdr-action-bar" }, { kind: "component", type: i1.ActionBarLeftComponent, selector: "vdr-ab-left", inputs: ["grow"] }, { kind: "component", type: i1.ActionBarRightComponent, selector: "vdr-ab-right", inputs: ["grow"] }, { kind: "component", type: i1.ActionBarDropdownMenuComponent, selector: "vdr-action-bar-dropdown-menu", inputs: ["alwaysShow"] }, { kind: "component", type: i1.ChipComponent, selector: "vdr-chip", inputs: ["icon", "invert", "colorFrom", "colorType"], outputs: ["iconClick"] }, { kind: "component", type: i1.LanguageSelectorComponent, selector: "vdr-language-selector", inputs: ["currentLanguageCode", "availableLanguageCodes", "disabled"], outputs: ["languageCodeChange"] }, { kind: "directive", type: i1.IfPermissionsDirective, selector: "[vdrIfPermissions]", inputs: ["vdrIfPermissions", "vdrIfPermissionsElse"] }, { kind: "component", type: i1.ActionBarItemsComponent, selector: "vdr-action-bar-items" }, { kind: "component", type: i1.BulkActionMenuComponent, selector: "vdr-bulk-action-menu", inputs: ["locationId", "selectionManager", "hostComponent"] }, { kind: "component", type: i1.DataTable2ColumnComponent, selector: "vdr-dt2-column", inputs: ["id", "expand", "heading", "align", "sort", "optional", "hiddenByDefault", "orderable"], exportAs: ["row"] }, { kind: "component", type: i1.DataTable2SearchComponent, selector: "vdr-dt2-search", inputs: ["searchTermControl", "searchTermPlaceholder"] }, { kind: "component", type: i1.DataTableCustomFieldColumnComponent, selector: "vdr-dt2-custom-field-column", inputs: ["customField", "sorts"], exportAs: ["row"] }, { kind: "component", type: i1.SplitViewComponent, selector: "vdr-split-view", inputs: ["rightPanelOpen"], outputs: ["closeClicked"] }, { kind: "directive", type: i1.SplitViewLeftDirective, selector: "[vdrSplitViewLeft]" }, { kind: "directive", type: i1.SplitViewRightDirective, selector: "[vdrSplitViewRight]", inputs: ["splitViewTitle"] }, { kind: "component", type: i1.PageBlockComponent, selector: "vdr-page-block" }, { kind: "component", type: CollectionContentsComponent, selector: "vdr-collection-contents", inputs: ["collectionId", "parentId", "inheritFilters", "updatedFilters", "previewUpdatedFilters"] }, { kind: "component", type: CollectionDataTableComponent, selector: "vdr-collection-data-table", inputs: ["subCollections"], outputs: ["changeOrder"] }, { kind: "pipe", type: i3$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }, { kind: "pipe", type: i1.LocaleDatePipe, name: "localeDate" }, { kind: "pipe", type: CollectionBreadcrumbPipe, name: "collectionBreadcrumb" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
2367
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: CollectionListComponent, deps: [{ token: i1.DataService }, { token: i1.NotificationService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2368
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: CollectionListComponent, isStandalone: false, selector: "vdr-collection-list", usesInheritance: true, ngImport: i0, template: "<vdr-page-block>\n <vdr-action-bar>\n <vdr-ab-left>\n <vdr-language-selector\n [availableLanguageCodes]=\"availableLanguages$ | async\"\n [currentLanguageCode]=\"contentLanguage$ | async\"\n (languageCodeChange)=\"setLanguage($event)\"\n ></vdr-language-selector>\n </vdr-ab-left>\n <vdr-ab-right>\n <vdr-action-bar-items locationId=\"collection-list\" />\n <a\n class=\"btn btn-primary\"\n *vdrIfPermissions=\"['CreateCatalog', 'CreateCollection']\"\n [routerLink]=\"['./create']\"\n >\n <clr-icon shape=\"plus\"></clr-icon>\n {{ 'catalog.create-new-collection' | translate }}\n </a>\n <vdr-action-bar-dropdown-menu locationId=\"collection-list\" />\n </vdr-ab-right>\n </vdr-action-bar>\n</vdr-page-block>\n<vdr-split-view [rightPanelOpen]=\"activeCollectionId$ | async\" (closeClicked)=\"closeContents()\">\n <ng-template vdrSplitViewLeft>\n <vdr-collection-data-table\n class=\"mt-2\"\n [id]=\"dataTableListId\"\n [items]=\"items$ | async\"\n [subCollections]=\"subCollections$ | async\"\n [itemsPerPage]=\"itemsPerPage$ | async\"\n [totalItems]=\"totalItems$ | async\"\n [currentPage]=\"currentPage$ | async\"\n [filters]=\"filters\"\n [activeIndex]=\"activeCollectionIndex$ | async\"\n (pageChange)=\"setPageNumber($event)\"\n (itemsPerPageChange)=\"setItemsPerPage($event)\"\n (changeOrder)=\"onRearrange($event)\"\n (visibleColumnsChange)=\"setVisibleColumns($event)\"\n >\n <vdr-bulk-action-menu\n locationId=\"collection-list\"\n [hostComponent]=\"this\"\n [selectionManager]=\"selectionManager\"\n ></vdr-bulk-action-menu>\n <vdr-dt2-search\n [searchTermControl]=\"searchTermControl\"\n [searchTermPlaceholder]=\"'common.search-by-name' | translate\"\n ></vdr-dt2-search>\n <vdr-dt2-column [heading]=\"'common.id' | translate\" id=\"id\" [hiddenByDefault]=\"true\">\n <ng-template let-collection=\"item\">\n {{ collection.id }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column\n [heading]=\"'common.created-at' | translate\" id=\"created-at\"\n [hiddenByDefault]=\"true\"\n [sort]=\"sorts.get('createdAt')\"\n >\n <ng-template let-collection=\"item\">\n {{ collection.createdAt | localeDate : 'short' }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column\n [heading]=\"'common.updated-at' | translate\" id=\"updated-at\"\n [hiddenByDefault]=\"true\"\n [sort]=\"sorts.get('updatedAt')\"\n >\n <ng-template let-collection=\"item\">\n {{ collection.updatedAt | localeDate : 'short' }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column\n [heading]=\"'common.position' | translate\" id=\"position\"\n [hiddenByDefault]=\"true\"\n [sort]=\"sorts.get('position')\"\n >\n <ng-template let-collection=\"item\">\n {{ collection.position }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column\n [heading]=\"'common.name' | translate\" id=\"name\"\n [optional]=\"false\"\n [sort]=\"sorts.get('name')\"\n >\n <ng-template let-collection=\"item\" let-depth=\"depth\">\n <div [ngClass]=\"'indent-' + depth\"></div>\n <clr-icon\n class=\"child-arrow\"\n [class.transparent]=\"depth === 0\"\n shape=\"child-arrow\"\n *ngIf=\"!collection.children?.length\"\n ></clr-icon>\n <button\n class=\"icon-button folder-button\"\n *ngIf=\"collection.children?.length\"\n (click)=\"toggleExpanded(collection)\"\n >\n <clr-icon shape=\"folder\" *ngIf=\"!expandedIds.includes(collection.id)\"></clr-icon>\n <clr-icon shape=\"folder-open\" *ngIf=\"expandedIds.includes(collection.id)\"></clr-icon>\n </button>\n <a class=\"button-ghost\" [routerLink]=\"['./', collection.id]\"\n ><span>{{ collection.name }}</span>\n <clr-icon shape=\"arrow right\"></clr-icon>\n </a>\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.breadcrumb' | translate\" id=\"breadcrumb\">\n <ng-template let-collection=\"item\">\n <div class=\"breadcrumb\">\n <ng-container *ngIf=\"collection | collectionBreadcrumb as breadcrumbs\">\n <ng-container *ngIf=\"breadcrumbs.length\">\n <div *ngFor=\"let item of breadcrumbs\">\n <span class=\"separator\">/</span>{{ item.name }}\n </div>\n </ng-container>\n <span class=\"separator\" *ngIf=\"!breadcrumbs.length\">/</span>\n </ng-container>\n </div>\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.slug' | translate\" id=\"slug\" [sort]=\"sorts.get('slug')\">\n <ng-template let-collection=\"item\">\n {{ collection.slug }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.visibility' | translate\" id=\"visibility\">\n <ng-template let-collection=\"item\">\n <vdr-chip *ngIf=\"collection.isPrivate\" colorType=\"warning\">{{\n 'common.private' | translate\n }}</vdr-chip>\n <vdr-chip *ngIf=\"!collection.isPrivate\" colorType=\"success\">{{\n 'common.public' | translate\n }}</vdr-chip>\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.view-contents' | translate\" id=\"view-contents\" [optional]=\"false\">\n <ng-template let-collection=\"item\">\n <a\n class=\"button-small bg-weight-150\"\n [routerLink]=\"['./', { contents: collection.id }]\"\n [queryParams]=\"{ contentsPage: 1 }\"\n queryParamsHandling=\"merge\"\n >\n <span>{{ 'common.view-contents' | translate }}</span>\n <clr-icon shape=\"file-group\"></clr-icon>\n </a>\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-custom-field-column\n *ngFor=\"let customField of customFields\"\n [customField]=\"customField\"\n [sorts]=\"sorts\"\n />\n </vdr-collection-data-table>\n </ng-template>\n <ng-template vdrSplitViewRight [splitViewTitle]=\"activeCollectionTitle$ | async\">\n <ng-container *ngIf=\"activeCollectionId$ | async as activeGroup\">\n <vdr-collection-contents [collectionId]=\"activeCollectionId$ | async\"></vdr-collection-contents>\n </ng-container>\n </ng-template>\n</vdr-split-view>\n", styles: ["", ":host{--indent-spacing: 18px}.indent-1{padding-inline-start:var(--indent-spacing)}.indent-2{padding-inline-start:calc(var(--indent-spacing) * 2)}.indent-3{padding-inline-start:calc(var(--indent-spacing) * 3)}.indent-4,.indent-5,.indent-6,.indent-7,.indent-8,.indent-9{padding-inline-start:calc(var(--indent-spacing) * 4)}.child-arrow{margin:1px 6px}.child-arrow.transparent{opacity:0}.breadcrumb{display:flex}.separator{color:var(--color-weight-500);margin:0 3px}\n"], dependencies: [{ kind: "directive", type: i3.ClrIconCustomTag, selector: "clr-icon" }, { kind: "directive", type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i1.ActionBarComponent, selector: "vdr-action-bar" }, { kind: "component", type: i1.ActionBarLeftComponent, selector: "vdr-ab-left", inputs: ["grow"] }, { kind: "component", type: i1.ActionBarRightComponent, selector: "vdr-ab-right", inputs: ["grow"] }, { kind: "component", type: i1.ActionBarDropdownMenuComponent, selector: "vdr-action-bar-dropdown-menu", inputs: ["alwaysShow"] }, { kind: "component", type: i1.ChipComponent, selector: "vdr-chip", inputs: ["icon", "invert", "colorFrom", "colorType"], outputs: ["iconClick"] }, { kind: "component", type: i1.LanguageSelectorComponent, selector: "vdr-language-selector", inputs: ["currentLanguageCode", "availableLanguageCodes", "disabled"], outputs: ["languageCodeChange"] }, { kind: "directive", type: i1.IfPermissionsDirective, selector: "[vdrIfPermissions]", inputs: ["vdrIfPermissions", "vdrIfPermissionsElse"] }, { kind: "component", type: i1.ActionBarItemsComponent, selector: "vdr-action-bar-items" }, { kind: "component", type: i1.BulkActionMenuComponent, selector: "vdr-bulk-action-menu", inputs: ["locationId", "selectionManager", "hostComponent"] }, { kind: "component", type: i1.DataTable2ColumnComponent, selector: "vdr-dt2-column", inputs: ["id", "expand", "heading", "align", "sort", "optional", "hiddenByDefault", "orderable"], exportAs: ["row"] }, { kind: "component", type: i1.DataTable2SearchComponent, selector: "vdr-dt2-search", inputs: ["searchTermControl", "searchTermPlaceholder"] }, { kind: "component", type: i1.DataTableCustomFieldColumnComponent, selector: "vdr-dt2-custom-field-column", inputs: ["customField", "sorts"], exportAs: ["row"] }, { kind: "component", type: i1.SplitViewComponent, selector: "vdr-split-view", inputs: ["rightPanelOpen"], outputs: ["closeClicked"] }, { kind: "directive", type: i1.SplitViewLeftDirective, selector: "[vdrSplitViewLeft]" }, { kind: "directive", type: i1.SplitViewRightDirective, selector: "[vdrSplitViewRight]", inputs: ["splitViewTitle"] }, { kind: "component", type: i1.PageBlockComponent, selector: "vdr-page-block" }, { kind: "component", type: CollectionContentsComponent, selector: "vdr-collection-contents", inputs: ["collectionId", "parentId", "inheritFilters", "updatedFilters", "previewUpdatedFilters"] }, { kind: "component", type: CollectionDataTableComponent, selector: "vdr-collection-data-table", inputs: ["subCollections"], outputs: ["changeOrder"] }, { kind: "pipe", type: i3$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }, { kind: "pipe", type: i1.LocaleDatePipe, name: "localeDate" }, { kind: "pipe", type: CollectionBreadcrumbPipe, name: "collectionBreadcrumb" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
2369
2369
|
}
|
|
2370
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
2370
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: CollectionListComponent, decorators: [{
|
|
2371
2371
|
type: Component,
|
|
2372
2372
|
args: [{ selector: 'vdr-collection-list', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<vdr-page-block>\n <vdr-action-bar>\n <vdr-ab-left>\n <vdr-language-selector\n [availableLanguageCodes]=\"availableLanguages$ | async\"\n [currentLanguageCode]=\"contentLanguage$ | async\"\n (languageCodeChange)=\"setLanguage($event)\"\n ></vdr-language-selector>\n </vdr-ab-left>\n <vdr-ab-right>\n <vdr-action-bar-items locationId=\"collection-list\" />\n <a\n class=\"btn btn-primary\"\n *vdrIfPermissions=\"['CreateCatalog', 'CreateCollection']\"\n [routerLink]=\"['./create']\"\n >\n <clr-icon shape=\"plus\"></clr-icon>\n {{ 'catalog.create-new-collection' | translate }}\n </a>\n <vdr-action-bar-dropdown-menu locationId=\"collection-list\" />\n </vdr-ab-right>\n </vdr-action-bar>\n</vdr-page-block>\n<vdr-split-view [rightPanelOpen]=\"activeCollectionId$ | async\" (closeClicked)=\"closeContents()\">\n <ng-template vdrSplitViewLeft>\n <vdr-collection-data-table\n class=\"mt-2\"\n [id]=\"dataTableListId\"\n [items]=\"items$ | async\"\n [subCollections]=\"subCollections$ | async\"\n [itemsPerPage]=\"itemsPerPage$ | async\"\n [totalItems]=\"totalItems$ | async\"\n [currentPage]=\"currentPage$ | async\"\n [filters]=\"filters\"\n [activeIndex]=\"activeCollectionIndex$ | async\"\n (pageChange)=\"setPageNumber($event)\"\n (itemsPerPageChange)=\"setItemsPerPage($event)\"\n (changeOrder)=\"onRearrange($event)\"\n (visibleColumnsChange)=\"setVisibleColumns($event)\"\n >\n <vdr-bulk-action-menu\n locationId=\"collection-list\"\n [hostComponent]=\"this\"\n [selectionManager]=\"selectionManager\"\n ></vdr-bulk-action-menu>\n <vdr-dt2-search\n [searchTermControl]=\"searchTermControl\"\n [searchTermPlaceholder]=\"'common.search-by-name' | translate\"\n ></vdr-dt2-search>\n <vdr-dt2-column [heading]=\"'common.id' | translate\" id=\"id\" [hiddenByDefault]=\"true\">\n <ng-template let-collection=\"item\">\n {{ collection.id }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column\n [heading]=\"'common.created-at' | translate\" id=\"created-at\"\n [hiddenByDefault]=\"true\"\n [sort]=\"sorts.get('createdAt')\"\n >\n <ng-template let-collection=\"item\">\n {{ collection.createdAt | localeDate : 'short' }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column\n [heading]=\"'common.updated-at' | translate\" id=\"updated-at\"\n [hiddenByDefault]=\"true\"\n [sort]=\"sorts.get('updatedAt')\"\n >\n <ng-template let-collection=\"item\">\n {{ collection.updatedAt | localeDate : 'short' }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column\n [heading]=\"'common.position' | translate\" id=\"position\"\n [hiddenByDefault]=\"true\"\n [sort]=\"sorts.get('position')\"\n >\n <ng-template let-collection=\"item\">\n {{ collection.position }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column\n [heading]=\"'common.name' | translate\" id=\"name\"\n [optional]=\"false\"\n [sort]=\"sorts.get('name')\"\n >\n <ng-template let-collection=\"item\" let-depth=\"depth\">\n <div [ngClass]=\"'indent-' + depth\"></div>\n <clr-icon\n class=\"child-arrow\"\n [class.transparent]=\"depth === 0\"\n shape=\"child-arrow\"\n *ngIf=\"!collection.children?.length\"\n ></clr-icon>\n <button\n class=\"icon-button folder-button\"\n *ngIf=\"collection.children?.length\"\n (click)=\"toggleExpanded(collection)\"\n >\n <clr-icon shape=\"folder\" *ngIf=\"!expandedIds.includes(collection.id)\"></clr-icon>\n <clr-icon shape=\"folder-open\" *ngIf=\"expandedIds.includes(collection.id)\"></clr-icon>\n </button>\n <a class=\"button-ghost\" [routerLink]=\"['./', collection.id]\"\n ><span>{{ collection.name }}</span>\n <clr-icon shape=\"arrow right\"></clr-icon>\n </a>\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.breadcrumb' | translate\" id=\"breadcrumb\">\n <ng-template let-collection=\"item\">\n <div class=\"breadcrumb\">\n <ng-container *ngIf=\"collection | collectionBreadcrumb as breadcrumbs\">\n <ng-container *ngIf=\"breadcrumbs.length\">\n <div *ngFor=\"let item of breadcrumbs\">\n <span class=\"separator\">/</span>{{ item.name }}\n </div>\n </ng-container>\n <span class=\"separator\" *ngIf=\"!breadcrumbs.length\">/</span>\n </ng-container>\n </div>\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.slug' | translate\" id=\"slug\" [sort]=\"sorts.get('slug')\">\n <ng-template let-collection=\"item\">\n {{ collection.slug }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.visibility' | translate\" id=\"visibility\">\n <ng-template let-collection=\"item\">\n <vdr-chip *ngIf=\"collection.isPrivate\" colorType=\"warning\">{{\n 'common.private' | translate\n }}</vdr-chip>\n <vdr-chip *ngIf=\"!collection.isPrivate\" colorType=\"success\">{{\n 'common.public' | translate\n }}</vdr-chip>\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.view-contents' | translate\" id=\"view-contents\" [optional]=\"false\">\n <ng-template let-collection=\"item\">\n <a\n class=\"button-small bg-weight-150\"\n [routerLink]=\"['./', { contents: collection.id }]\"\n [queryParams]=\"{ contentsPage: 1 }\"\n queryParamsHandling=\"merge\"\n >\n <span>{{ 'common.view-contents' | translate }}</span>\n <clr-icon shape=\"file-group\"></clr-icon>\n </a>\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-custom-field-column\n *ngFor=\"let customField of customFields\"\n [customField]=\"customField\"\n [sorts]=\"sorts\"\n />\n </vdr-collection-data-table>\n </ng-template>\n <ng-template vdrSplitViewRight [splitViewTitle]=\"activeCollectionTitle$ | async\">\n <ng-container *ngIf=\"activeCollectionId$ | async as activeGroup\">\n <vdr-collection-contents [collectionId]=\"activeCollectionId$ | async\"></vdr-collection-contents>\n </ng-container>\n </ng-template>\n</vdr-split-view>\n", styles: [":host{--indent-spacing: 18px}.indent-1{padding-inline-start:var(--indent-spacing)}.indent-2{padding-inline-start:calc(var(--indent-spacing) * 2)}.indent-3{padding-inline-start:calc(var(--indent-spacing) * 3)}.indent-4,.indent-5,.indent-6,.indent-7,.indent-8,.indent-9{padding-inline-start:calc(var(--indent-spacing) * 4)}.child-arrow{margin:1px 6px}.child-arrow.transparent{opacity:0}.breadcrumb{display:flex}.separator{color:var(--color-weight-500);margin:0 3px}\n"] }]
|
|
2373
2373
|
}], ctorParameters: () => [{ type: i1.DataService }, { type: i1.NotificationService }] });
|
|
@@ -2430,10 +2430,10 @@ class CollectionTreeService {
|
|
|
2430
2430
|
};
|
|
2431
2431
|
return visit(this.collectionTree, [], new Set(), []);
|
|
2432
2432
|
}
|
|
2433
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
2434
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.
|
|
2433
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: CollectionTreeService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
2434
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: CollectionTreeService }); }
|
|
2435
2435
|
}
|
|
2436
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
2436
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: CollectionTreeService, decorators: [{
|
|
2437
2437
|
type: Injectable
|
|
2438
2438
|
}], ctorParameters: () => [] });
|
|
2439
2439
|
|
|
@@ -2530,10 +2530,10 @@ class CollectionTreeNodeComponent {
|
|
|
2530
2530
|
delete(id) {
|
|
2531
2531
|
this.collectionTreeService.onDelete(id);
|
|
2532
2532
|
}
|
|
2533
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
2534
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: CollectionTreeNodeComponent, isStandalone: false, selector: "vdr-collection-tree-node", inputs: { collectionTree: "collectionTree", activeCollectionId: "activeCollectionId", expandAll: "expandAll", selectionManager: "selectionManager" }, usesOnChanges: true, ngImport: i0, template: "<div\n cdkDropList\n class=\"tree-node\"\n #dropList\n [cdkDropListData]=\"collectionTree\"\n [cdkDropListDisabled]=\"!(hasUpdatePermission$ | async)\"\n (cdkDropListDropped)=\"drop($event)\"\n>\n <div\n class=\"collection\"\n [class.private]=\"collection.isPrivate\"\n *ngFor=\"let collection of collectionTree.children; index as i; trackBy: trackByFn\"\n cdkDrag\n [cdkDragData]=\"collection\"\n >\n <div\n class=\"collection-detail\"\n [ngClass]=\"'depth-' + depth\"\n [class.active]=\"collection.id === activeCollectionId\"\n >\n <div>\n <input\n type=\"checkbox\"\n clrCheckbox\n [checked]=\"selectionManager.isSelected(collection)\"\n (click)=\"selectionManager.toggleSelection(collection, $event)\"\n />\n </div>\n <div class=\"name\">\n <button\n class=\"icon-button folder-button\"\n [disabled]=\"expandAll\"\n *ngIf=\"collection.children?.length; else folderSpacer\"\n (click)=\"toggleExpanded(collection)\"\n >\n <clr-icon shape=\"folder\" *ngIf=\"!collection.expanded && !expandAll\"></clr-icon>\n <clr-icon shape=\"folder-open\" *ngIf=\"collection.expanded || expandAll\"></clr-icon>\n </button>\n <ng-template #folderSpacer>\n <div class=\"folder-button-spacer\"></div>\n </ng-template>\n {{ collection.name }}\n </div>\n <div class=\"flex-spacer\"></div>\n <vdr-chip *ngIf=\"collection.isPrivate\">{{ 'catalog.private' | translate }}</vdr-chip>\n <a\n class=\"btn btn-link btn-sm\"\n [routerLink]=\"['./', { contents: collection.id }]\"\n queryParamsHandling=\"preserve\"\n >\n <clr-icon shape=\"view-list\"></clr-icon>\n {{ 'catalog.view-contents' | translate }}\n </a>\n <a class=\"btn btn-link btn-sm\" [routerLink]=\"['/catalog/collections/', collection.id]\">\n <clr-icon shape=\"edit\"></clr-icon>\n {{ 'common.edit' | translate }}\n </a>\n <div class=\"drag-handle\" cdkDragHandle *vdrIfPermissions=\"['UpdateCatalog', 'UpdateCollection']\">\n <clr-icon shape=\"drag-handle\" size=\"24\"></clr-icon>\n </div>\n <vdr-dropdown>\n <button class=\"icon-button\" vdrDropdownTrigger (click)=\"getMoveListItems(collection)\">\n <clr-icon shape=\"ellipsis-vertical\"></clr-icon>\n </button>\n <vdr-dropdown-menu vdrPosition=\"bottom-right\">\n <a\n class=\"dropdown-item\"\n [routerLink]=\"['./', 'create', { parentId: collection.id }]\"\n *vdrIfPermissions=\"['CreateCatalog', 'CreateCollection']\"\n >\n <clr-icon shape=\"plus\"></clr-icon>\n {{ 'catalog.create-new-collection' | translate }}\n </a>\n <div class=\"dropdown-divider\"></div>\n <button\n type=\"button\"\n vdrDropdownItem\n [disabled]=\"i === 0 || !(hasUpdatePermission$ | async)\"\n (click)=\"moveUp(collection, i)\"\n >\n <clr-icon shape=\"caret up\"></clr-icon>\n {{ 'catalog.move-up' | translate }}\n </button>\n <button\n type=\"button\"\n vdrDropdownItem\n [disabled]=\"\n i === collectionTree.children.length - 1 || !(hasUpdatePermission$ | async)\n \"\n (click)=\"moveDown(collection, i)\"\n >\n <clr-icon shape=\"caret down\"></clr-icon>\n {{ 'catalog.move-down' | translate }}\n </button>\n <h4 class=\"dropdown-header\">{{ 'catalog.move-to' | translate }}</h4>\n <button\n type=\"button\"\n vdrDropdownItem\n *ngFor=\"let item of moveListItems\"\n (click)=\"move(collection, item.id)\"\n [disabled]=\"!(hasUpdatePermission$ | async)\"\n >\n <div class=\"move-to-item\">\n <div class=\"move-icon\">\n <clr-icon shape=\"child-arrow\"></clr-icon>\n </div>\n <div class=\"path\">\n {{ item.path }}\n </div>\n </div>\n </button>\n <div class=\"dropdown-divider\"></div>\n <button\n class=\"button\"\n vdrDropdownItem\n (click)=\"delete(collection.id)\"\n [disabled]=\"!(hasDeletePermission$ | async)\"\n >\n <clr-icon shape=\"trash\" class=\"is-danger\"></clr-icon>\n {{ 'common.delete' | translate }}\n </button>\n </vdr-dropdown-menu>\n </vdr-dropdown>\n </div>\n <vdr-collection-tree-node\n *ngIf=\"collection.expanded || expandAll\"\n [expandAll]=\"expandAll\"\n [collectionTree]=\"collection\"\n [activeCollectionId]=\"activeCollectionId\"\n [selectionManager]=\"selectionManager\"\n ></vdr-collection-tree-node>\n </div>\n</div>\n", styles: [":host{display:block}.collection{background-color:var(--clr-table-bgcolor);border-radius:var(--clr-global-borderradius);font-size:.65rem;transition:transform .25s cubic-bezier(0,0,.2,1);margin-bottom:2px;border-inline-start:2px solid transparent;transition:border-left-color .2s}.collection.private{background-color:var(--color-component-bg-200)}.collection .collection-detail{padding:6px 12px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--color-component-border-100)}.collection .collection-detail.active{background-color:var(--clr-global-selection-color)}.collection .collection-detail.depth-1{padding-inline-start:36px}.collection .collection-detail.depth-2{padding-inline-start:60px}.collection .collection-detail.depth-3{padding-inline-start:84px}.collection .collection-detail.depth-4{padding-inline-start:108px}.collection .collection-detail .folder-button-spacer{display:inline-block;width:28px}.tree-node{display:block;background-color:var(--clr-table-bgcolor);border-radius:var(--clr-global-borderradius);overflow:hidden}.tree-node.cdk-drop-list-dragging>.collection{border-left-color:var(--color-primary-300)}.drag-placeholder{min-height:120px;background-color:var(--color-component-bg-300);transition:transform .25s cubic-bezier(0,0,.2,1)}.cdk-drag-preview{box-sizing:border-box;border-radius:4px;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}.cdk-drag-placeholder{opacity:0}.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.example-list.cdk-drop-list-dragging .tree-node:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}.move-to-item{display:flex;white-space:normal;align-items:baseline}.move-to-item .move-icon{flex:none;margin-inline-end:3px}.move-to-item .path{line-height:18px}\n"], dependencies: [{ kind: "directive", type: i3.ClrIconCustomTag, selector: "clr-icon" }, { kind: "directive", type: i3.ClrCheckbox, selector: "[clrCheckbox],[clrToggle]" }, { kind: "directive", type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i4.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i4.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i4.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "component", type: i1.ChipComponent, selector: "vdr-chip", inputs: ["icon", "invert", "colorFrom", "colorType"], outputs: ["iconClick"] }, { kind: "directive", type: i1.FormFieldControlDirective, selector: "input, textarea, select, vdr-currency-input" }, { kind: "component", type: i1.DropdownComponent, selector: "vdr-dropdown", inputs: ["manualToggle"] }, { kind: "component", type: i1.DropdownMenuComponent, selector: "vdr-dropdown-menu", inputs: ["vdrPosition", "customClasses"] }, { kind: "directive", type: i1.DropdownTriggerDirective, selector: "[vdrDropdownTrigger]" }, { kind: "directive", type: i1.DropdownItemDirective, selector: "[vdrDropdownItem]" }, { kind: "directive", type: i1.IfPermissionsDirective, selector: "[vdrIfPermissions]", inputs: ["vdrIfPermissions", "vdrIfPermissionsElse"] }, { kind: "component", type: CollectionTreeNodeComponent, selector: "vdr-collection-tree-node", inputs: ["collectionTree", "activeCollectionId", "expandAll", "selectionManager"] }, { kind: "pipe", type: i3$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
2533
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: CollectionTreeNodeComponent, deps: [{ token: CollectionTreeNodeComponent, optional: true, skipSelf: true }, { token: i1.DataService }, { token: CollectionTreeService }, { token: i1$1.Router }, { token: i1$1.ActivatedRoute }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2534
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: CollectionTreeNodeComponent, isStandalone: false, selector: "vdr-collection-tree-node", inputs: { collectionTree: "collectionTree", activeCollectionId: "activeCollectionId", expandAll: "expandAll", selectionManager: "selectionManager" }, usesOnChanges: true, ngImport: i0, template: "<div\n cdkDropList\n class=\"tree-node\"\n #dropList\n [cdkDropListData]=\"collectionTree\"\n [cdkDropListDisabled]=\"!(hasUpdatePermission$ | async)\"\n (cdkDropListDropped)=\"drop($event)\"\n>\n <div\n class=\"collection\"\n [class.private]=\"collection.isPrivate\"\n *ngFor=\"let collection of collectionTree.children; index as i; trackBy: trackByFn\"\n cdkDrag\n [cdkDragData]=\"collection\"\n >\n <div\n class=\"collection-detail\"\n [ngClass]=\"'depth-' + depth\"\n [class.active]=\"collection.id === activeCollectionId\"\n >\n <div>\n <input\n type=\"checkbox\"\n clrCheckbox\n [checked]=\"selectionManager.isSelected(collection)\"\n (click)=\"selectionManager.toggleSelection(collection, $event)\"\n />\n </div>\n <div class=\"name\">\n <button\n class=\"icon-button folder-button\"\n [disabled]=\"expandAll\"\n *ngIf=\"collection.children?.length; else folderSpacer\"\n (click)=\"toggleExpanded(collection)\"\n >\n <clr-icon shape=\"folder\" *ngIf=\"!collection.expanded && !expandAll\"></clr-icon>\n <clr-icon shape=\"folder-open\" *ngIf=\"collection.expanded || expandAll\"></clr-icon>\n </button>\n <ng-template #folderSpacer>\n <div class=\"folder-button-spacer\"></div>\n </ng-template>\n {{ collection.name }}\n </div>\n <div class=\"flex-spacer\"></div>\n <vdr-chip *ngIf=\"collection.isPrivate\">{{ 'catalog.private' | translate }}</vdr-chip>\n <a\n class=\"btn btn-link btn-sm\"\n [routerLink]=\"['./', { contents: collection.id }]\"\n queryParamsHandling=\"preserve\"\n >\n <clr-icon shape=\"view-list\"></clr-icon>\n {{ 'catalog.view-contents' | translate }}\n </a>\n <a class=\"btn btn-link btn-sm\" [routerLink]=\"['/catalog/collections/', collection.id]\">\n <clr-icon shape=\"edit\"></clr-icon>\n {{ 'common.edit' | translate }}\n </a>\n <div class=\"drag-handle\" cdkDragHandle *vdrIfPermissions=\"['UpdateCatalog', 'UpdateCollection']\">\n <clr-icon shape=\"drag-handle\" size=\"24\"></clr-icon>\n </div>\n <vdr-dropdown>\n <button class=\"icon-button\" vdrDropdownTrigger (click)=\"getMoveListItems(collection)\">\n <clr-icon shape=\"ellipsis-vertical\"></clr-icon>\n </button>\n <vdr-dropdown-menu vdrPosition=\"bottom-right\">\n <a\n class=\"dropdown-item\"\n [routerLink]=\"['./', 'create', { parentId: collection.id }]\"\n *vdrIfPermissions=\"['CreateCatalog', 'CreateCollection']\"\n >\n <clr-icon shape=\"plus\"></clr-icon>\n {{ 'catalog.create-new-collection' | translate }}\n </a>\n <div class=\"dropdown-divider\"></div>\n <button\n type=\"button\"\n vdrDropdownItem\n [disabled]=\"i === 0 || !(hasUpdatePermission$ | async)\"\n (click)=\"moveUp(collection, i)\"\n >\n <clr-icon shape=\"caret up\"></clr-icon>\n {{ 'catalog.move-up' | translate }}\n </button>\n <button\n type=\"button\"\n vdrDropdownItem\n [disabled]=\"\n i === collectionTree.children.length - 1 || !(hasUpdatePermission$ | async)\n \"\n (click)=\"moveDown(collection, i)\"\n >\n <clr-icon shape=\"caret down\"></clr-icon>\n {{ 'catalog.move-down' | translate }}\n </button>\n <h4 class=\"dropdown-header\">{{ 'catalog.move-to' | translate }}</h4>\n <button\n type=\"button\"\n vdrDropdownItem\n *ngFor=\"let item of moveListItems\"\n (click)=\"move(collection, item.id)\"\n [disabled]=\"!(hasUpdatePermission$ | async)\"\n >\n <div class=\"move-to-item\">\n <div class=\"move-icon\">\n <clr-icon shape=\"child-arrow\"></clr-icon>\n </div>\n <div class=\"path\">\n {{ item.path }}\n </div>\n </div>\n </button>\n <div class=\"dropdown-divider\"></div>\n <button\n class=\"button\"\n vdrDropdownItem\n (click)=\"delete(collection.id)\"\n [disabled]=\"!(hasDeletePermission$ | async)\"\n >\n <clr-icon shape=\"trash\" class=\"is-danger\"></clr-icon>\n {{ 'common.delete' | translate }}\n </button>\n </vdr-dropdown-menu>\n </vdr-dropdown>\n </div>\n <vdr-collection-tree-node\n *ngIf=\"collection.expanded || expandAll\"\n [expandAll]=\"expandAll\"\n [collectionTree]=\"collection\"\n [activeCollectionId]=\"activeCollectionId\"\n [selectionManager]=\"selectionManager\"\n ></vdr-collection-tree-node>\n </div>\n</div>\n", styles: [":host{display:block}.collection{background-color:var(--clr-table-bgcolor);border-radius:var(--clr-global-borderradius);font-size:.65rem;transition:transform .25s cubic-bezier(0,0,.2,1);margin-bottom:2px;border-inline-start:2px solid transparent;transition:border-left-color .2s}.collection.private{background-color:var(--color-component-bg-200)}.collection .collection-detail{padding:6px 12px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--color-component-border-100)}.collection .collection-detail.active{background-color:var(--clr-global-selection-color)}.collection .collection-detail.depth-1{padding-inline-start:36px}.collection .collection-detail.depth-2{padding-inline-start:60px}.collection .collection-detail.depth-3{padding-inline-start:84px}.collection .collection-detail.depth-4{padding-inline-start:108px}.collection .collection-detail .folder-button-spacer{display:inline-block;width:28px}.tree-node{display:block;background-color:var(--clr-table-bgcolor);border-radius:var(--clr-global-borderradius);overflow:hidden}.tree-node.cdk-drop-list-dragging>.collection{border-left-color:var(--color-primary-300)}.drag-placeholder{min-height:120px;background-color:var(--color-component-bg-300);transition:transform .25s cubic-bezier(0,0,.2,1)}.cdk-drag-preview{box-sizing:border-box;border-radius:4px;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}.cdk-drag-placeholder{opacity:0}.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.example-list.cdk-drop-list-dragging .tree-node:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}.move-to-item{display:flex;white-space:normal;align-items:baseline}.move-to-item .move-icon{flex:none;margin-inline-end:3px}.move-to-item .path{line-height:18px}\n"], dependencies: [{ kind: "directive", type: i3.ClrIconCustomTag, selector: "clr-icon" }, { kind: "directive", type: i3.ClrCheckbox, selector: "[clrCheckbox],[clrToggle]" }, { kind: "directive", type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i4.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i4.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i4.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "component", type: i1.ChipComponent, selector: "vdr-chip", inputs: ["icon", "invert", "colorFrom", "colorType"], outputs: ["iconClick"] }, { kind: "directive", type: i1.FormFieldControlDirective, selector: "input, textarea, select, vdr-currency-input" }, { kind: "component", type: i1.DropdownComponent, selector: "vdr-dropdown", inputs: ["manualToggle"] }, { kind: "component", type: i1.DropdownMenuComponent, selector: "vdr-dropdown-menu", inputs: ["vdrPosition", "customClasses"] }, { kind: "directive", type: i1.DropdownTriggerDirective, selector: "[vdrDropdownTrigger]" }, { kind: "directive", type: i1.DropdownItemDirective, selector: "[vdrDropdownItem]" }, { kind: "directive", type: i1.IfPermissionsDirective, selector: "[vdrIfPermissions]", inputs: ["vdrIfPermissions", "vdrIfPermissionsElse"] }, { kind: "component", type: CollectionTreeNodeComponent, selector: "vdr-collection-tree-node", inputs: ["collectionTree", "activeCollectionId", "expandAll", "selectionManager"] }, { kind: "pipe", type: i3$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
2535
2535
|
}
|
|
2536
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
2536
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: CollectionTreeNodeComponent, decorators: [{
|
|
2537
2537
|
type: Component,
|
|
2538
2538
|
args: [{ selector: 'vdr-collection-tree-node', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<div\n cdkDropList\n class=\"tree-node\"\n #dropList\n [cdkDropListData]=\"collectionTree\"\n [cdkDropListDisabled]=\"!(hasUpdatePermission$ | async)\"\n (cdkDropListDropped)=\"drop($event)\"\n>\n <div\n class=\"collection\"\n [class.private]=\"collection.isPrivate\"\n *ngFor=\"let collection of collectionTree.children; index as i; trackBy: trackByFn\"\n cdkDrag\n [cdkDragData]=\"collection\"\n >\n <div\n class=\"collection-detail\"\n [ngClass]=\"'depth-' + depth\"\n [class.active]=\"collection.id === activeCollectionId\"\n >\n <div>\n <input\n type=\"checkbox\"\n clrCheckbox\n [checked]=\"selectionManager.isSelected(collection)\"\n (click)=\"selectionManager.toggleSelection(collection, $event)\"\n />\n </div>\n <div class=\"name\">\n <button\n class=\"icon-button folder-button\"\n [disabled]=\"expandAll\"\n *ngIf=\"collection.children?.length; else folderSpacer\"\n (click)=\"toggleExpanded(collection)\"\n >\n <clr-icon shape=\"folder\" *ngIf=\"!collection.expanded && !expandAll\"></clr-icon>\n <clr-icon shape=\"folder-open\" *ngIf=\"collection.expanded || expandAll\"></clr-icon>\n </button>\n <ng-template #folderSpacer>\n <div class=\"folder-button-spacer\"></div>\n </ng-template>\n {{ collection.name }}\n </div>\n <div class=\"flex-spacer\"></div>\n <vdr-chip *ngIf=\"collection.isPrivate\">{{ 'catalog.private' | translate }}</vdr-chip>\n <a\n class=\"btn btn-link btn-sm\"\n [routerLink]=\"['./', { contents: collection.id }]\"\n queryParamsHandling=\"preserve\"\n >\n <clr-icon shape=\"view-list\"></clr-icon>\n {{ 'catalog.view-contents' | translate }}\n </a>\n <a class=\"btn btn-link btn-sm\" [routerLink]=\"['/catalog/collections/', collection.id]\">\n <clr-icon shape=\"edit\"></clr-icon>\n {{ 'common.edit' | translate }}\n </a>\n <div class=\"drag-handle\" cdkDragHandle *vdrIfPermissions=\"['UpdateCatalog', 'UpdateCollection']\">\n <clr-icon shape=\"drag-handle\" size=\"24\"></clr-icon>\n </div>\n <vdr-dropdown>\n <button class=\"icon-button\" vdrDropdownTrigger (click)=\"getMoveListItems(collection)\">\n <clr-icon shape=\"ellipsis-vertical\"></clr-icon>\n </button>\n <vdr-dropdown-menu vdrPosition=\"bottom-right\">\n <a\n class=\"dropdown-item\"\n [routerLink]=\"['./', 'create', { parentId: collection.id }]\"\n *vdrIfPermissions=\"['CreateCatalog', 'CreateCollection']\"\n >\n <clr-icon shape=\"plus\"></clr-icon>\n {{ 'catalog.create-new-collection' | translate }}\n </a>\n <div class=\"dropdown-divider\"></div>\n <button\n type=\"button\"\n vdrDropdownItem\n [disabled]=\"i === 0 || !(hasUpdatePermission$ | async)\"\n (click)=\"moveUp(collection, i)\"\n >\n <clr-icon shape=\"caret up\"></clr-icon>\n {{ 'catalog.move-up' | translate }}\n </button>\n <button\n type=\"button\"\n vdrDropdownItem\n [disabled]=\"\n i === collectionTree.children.length - 1 || !(hasUpdatePermission$ | async)\n \"\n (click)=\"moveDown(collection, i)\"\n >\n <clr-icon shape=\"caret down\"></clr-icon>\n {{ 'catalog.move-down' | translate }}\n </button>\n <h4 class=\"dropdown-header\">{{ 'catalog.move-to' | translate }}</h4>\n <button\n type=\"button\"\n vdrDropdownItem\n *ngFor=\"let item of moveListItems\"\n (click)=\"move(collection, item.id)\"\n [disabled]=\"!(hasUpdatePermission$ | async)\"\n >\n <div class=\"move-to-item\">\n <div class=\"move-icon\">\n <clr-icon shape=\"child-arrow\"></clr-icon>\n </div>\n <div class=\"path\">\n {{ item.path }}\n </div>\n </div>\n </button>\n <div class=\"dropdown-divider\"></div>\n <button\n class=\"button\"\n vdrDropdownItem\n (click)=\"delete(collection.id)\"\n [disabled]=\"!(hasDeletePermission$ | async)\"\n >\n <clr-icon shape=\"trash\" class=\"is-danger\"></clr-icon>\n {{ 'common.delete' | translate }}\n </button>\n </vdr-dropdown-menu>\n </vdr-dropdown>\n </div>\n <vdr-collection-tree-node\n *ngIf=\"collection.expanded || expandAll\"\n [expandAll]=\"expandAll\"\n [collectionTree]=\"collection\"\n [activeCollectionId]=\"activeCollectionId\"\n [selectionManager]=\"selectionManager\"\n ></vdr-collection-tree-node>\n </div>\n</div>\n", styles: [":host{display:block}.collection{background-color:var(--clr-table-bgcolor);border-radius:var(--clr-global-borderradius);font-size:.65rem;transition:transform .25s cubic-bezier(0,0,.2,1);margin-bottom:2px;border-inline-start:2px solid transparent;transition:border-left-color .2s}.collection.private{background-color:var(--color-component-bg-200)}.collection .collection-detail{padding:6px 12px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--color-component-border-100)}.collection .collection-detail.active{background-color:var(--clr-global-selection-color)}.collection .collection-detail.depth-1{padding-inline-start:36px}.collection .collection-detail.depth-2{padding-inline-start:60px}.collection .collection-detail.depth-3{padding-inline-start:84px}.collection .collection-detail.depth-4{padding-inline-start:108px}.collection .collection-detail .folder-button-spacer{display:inline-block;width:28px}.tree-node{display:block;background-color:var(--clr-table-bgcolor);border-radius:var(--clr-global-borderradius);overflow:hidden}.tree-node.cdk-drop-list-dragging>.collection{border-left-color:var(--color-primary-300)}.drag-placeholder{min-height:120px;background-color:var(--color-component-bg-300);transition:transform .25s cubic-bezier(0,0,.2,1)}.cdk-drag-preview{box-sizing:border-box;border-radius:4px;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}.cdk-drag-placeholder{opacity:0}.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.example-list.cdk-drop-list-dragging .tree-node:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}.move-to-item{display:flex;white-space:normal;align-items:baseline}.move-to-item .move-icon{flex:none;margin-inline-end:3px}.move-to-item .path{line-height:18px}\n"] }]
|
|
2539
2539
|
}], ctorParameters: () => [{ type: CollectionTreeNodeComponent, decorators: [{
|
|
@@ -2625,10 +2625,10 @@ class CollectionTreeComponent {
|
|
|
2625
2625
|
this.collectionTreeService.rearrange$.subscribe(event => this.rearrange.emit(event));
|
|
2626
2626
|
this.collectionTreeService.delete$.subscribe(id => this.deleteCollection.emit(id));
|
|
2627
2627
|
}
|
|
2628
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
2629
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
2628
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: CollectionTreeComponent, deps: [{ token: CollectionTreeService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2629
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: CollectionTreeComponent, isStandalone: false, selector: "vdr-collection-tree", inputs: { collections: "collections", activeCollectionId: "activeCollectionId", expandAll: "expandAll", expandedIds: "expandedIds", selectionManager: "selectionManager" }, outputs: { rearrange: "rearrange", deleteCollection: "deleteCollection" }, providers: [CollectionTreeService], usesOnChanges: true, ngImport: i0, template: "<vdr-collection-tree-node\n *ngIf=\"collectionTree\"\n cdkDropListGroup\n [expandAll]=\"expandAll\"\n [collectionTree]=\"collectionTree\"\n [selectionManager]=\"selectionManager\"\n [activeCollectionId]=\"activeCollectionId\"\n></vdr-collection-tree-node>\n", styles: [""], dependencies: [{ kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.CdkDropListGroup, selector: "[cdkDropListGroup]", inputs: ["cdkDropListGroupDisabled"], exportAs: ["cdkDropListGroup"] }, { kind: "component", type: CollectionTreeNodeComponent, selector: "vdr-collection-tree-node", inputs: ["collectionTree", "activeCollectionId", "expandAll", "selectionManager"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
2630
2630
|
}
|
|
2631
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
2631
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: CollectionTreeComponent, decorators: [{
|
|
2632
2632
|
type: Component,
|
|
2633
2633
|
args: [{ selector: 'vdr-collection-tree', changeDetection: ChangeDetectionStrategy.OnPush, providers: [CollectionTreeService], standalone: false, template: "<vdr-collection-tree-node\n *ngIf=\"collectionTree\"\n cdkDropListGroup\n [expandAll]=\"expandAll\"\n [collectionTree]=\"collectionTree\"\n [selectionManager]=\"selectionManager\"\n [activeCollectionId]=\"activeCollectionId\"\n></vdr-collection-tree-node>\n" }]
|
|
2634
2634
|
}], ctorParameters: () => [{ type: CollectionTreeService }], propDecorators: { collections: [{
|
|
@@ -2657,10 +2657,10 @@ class ConfirmVariantDeletionDialogComponent {
|
|
|
2657
2657
|
cancel() {
|
|
2658
2658
|
this.resolveWith();
|
|
2659
2659
|
}
|
|
2660
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
2661
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
2660
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ConfirmVariantDeletionDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2661
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: ConfirmVariantDeletionDialogComponent, isStandalone: false, selector: "vdr-confirm-variant-deletion-dialog", ngImport: i0, template: "<ng-template vdrDialogTitle>\n {{ 'catalog.confirm-deletion-of-unused-variants-title' | translate }}\n</ng-template>\n{{ 'catalog.confirm-deletion-of-unused-variants-body' | translate }}\n<ul>\n <li *ngFor=\"let variant of variants\">{{ variant.name }} ({{ variant.sku }})</li>\n</ul>\n<ng-template vdrDialogButtons>\n <button type=\"button\" class=\"btn\" (click)=\"cancel()\">{{ 'common.cancel' | translate }}</button>\n <button type=\"submit\" (click)=\"confirm()\" class=\"btn btn-primary\">\n {{ 'common.confirm' | translate }}\n </button>\n</ng-template>\n", styles: [""], dependencies: [{ kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.DialogButtonsDirective, selector: "[vdrDialogButtons]" }, { kind: "directive", type: i1.DialogTitleDirective, selector: "[vdrDialogTitle]" }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
2662
2662
|
}
|
|
2663
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
2663
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ConfirmVariantDeletionDialogComponent, decorators: [{
|
|
2664
2664
|
type: Component,
|
|
2665
2665
|
args: [{ selector: 'vdr-confirm-variant-deletion-dialog', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<ng-template vdrDialogTitle>\n {{ 'catalog.confirm-deletion-of-unused-variants-title' | translate }}\n</ng-template>\n{{ 'catalog.confirm-deletion-of-unused-variants-body' | translate }}\n<ul>\n <li *ngFor=\"let variant of variants\">{{ variant.name }} ({{ variant.sku }})</li>\n</ul>\n<ng-template vdrDialogButtons>\n <button type=\"button\" class=\"btn\" (click)=\"cancel()\">{{ 'common.cancel' | translate }}</button>\n <button type=\"submit\" (click)=\"confirm()\" class=\"btn btn-primary\">\n {{ 'common.confirm' | translate }}\n </button>\n</ng-template>\n" }]
|
|
2666
2666
|
}] });
|
|
@@ -2694,10 +2694,10 @@ class CreateFacetValueDialogComponent {
|
|
|
2694
2694
|
cancel() {
|
|
2695
2695
|
this.resolveWith();
|
|
2696
2696
|
}
|
|
2697
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
2698
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
2697
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: CreateFacetValueDialogComponent, deps: [{ token: i2.FormBuilder }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2698
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: CreateFacetValueDialogComponent, isStandalone: false, selector: "vdr-create-facet-value-dialog", ngImport: i0, template: "<ng-template vdrDialogTitle>\n {{ 'catalog.create-facet-value' | translate }}\n</ng-template>\n<div class=\"form-grid\" [formGroup]=\"form\">\n <vdr-form-field [label]=\"'common.name' | translate\" for=\"name\">\n <input id=\"name\" type=\"text\" formControlName=\"name\" (input)=\"updateCode()\" />\n </vdr-form-field>\n <vdr-form-field\n [label]=\"'common.code' | translate\"\n for=\"code\"\n >\n <input\n id=\"code\"\n type=\"text\"\n formControlName=\"code\"\n />\n </vdr-form-field>\n</div>\n<ng-template vdrDialogButtons>\n <button type=\"button\" class=\"btn\" (click)=\"cancel()\">{{ 'common.cancel' | translate }}</button>\n <button type=\"submit\" (click)=\"confirm()\" class=\"btn btn-primary\" [disabled]=\"form.invalid\">\n {{ 'common.confirm' | translate }}\n </button>\n</ng-template>\n", styles: [""], dependencies: [{ kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i1.FormFieldComponent, selector: "vdr-form-field", inputs: ["label", "for", "tooltip", "errors", "readOnlyToggle"], outputs: ["readOnlyToggleChange"] }, { kind: "directive", type: i1.FormFieldControlDirective, selector: "input, textarea, select, vdr-currency-input" }, { kind: "directive", type: i1.DialogButtonsDirective, selector: "[vdrDialogButtons]" }, { kind: "directive", type: i1.DialogTitleDirective, selector: "[vdrDialogTitle]" }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
2699
2699
|
}
|
|
2700
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
2700
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: CreateFacetValueDialogComponent, decorators: [{
|
|
2701
2701
|
type: Component,
|
|
2702
2702
|
args: [{ selector: 'vdr-create-facet-value-dialog', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<ng-template vdrDialogTitle>\n {{ 'catalog.create-facet-value' | translate }}\n</ng-template>\n<div class=\"form-grid\" [formGroup]=\"form\">\n <vdr-form-field [label]=\"'common.name' | translate\" for=\"name\">\n <input id=\"name\" type=\"text\" formControlName=\"name\" (input)=\"updateCode()\" />\n </vdr-form-field>\n <vdr-form-field\n [label]=\"'common.code' | translate\"\n for=\"code\"\n >\n <input\n id=\"code\"\n type=\"text\"\n formControlName=\"code\"\n />\n </vdr-form-field>\n</div>\n<ng-template vdrDialogButtons>\n <button type=\"button\" class=\"btn\" (click)=\"cancel()\">{{ 'common.cancel' | translate }}</button>\n <button type=\"submit\" (click)=\"confirm()\" class=\"btn btn-primary\" [disabled]=\"form.invalid\">\n {{ 'common.confirm' | translate }}\n </button>\n</ng-template>\n" }]
|
|
2703
2703
|
}], ctorParameters: () => [{ type: i2.FormBuilder }] });
|
|
@@ -3014,10 +3014,10 @@ class FacetDetailComponent extends TypedBaseDetailComponent {
|
|
|
3014
3014
|
}))
|
|
3015
3015
|
.filter(notNullOrUndefined);
|
|
3016
3016
|
}
|
|
3017
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
3018
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: FacetDetailComponent, isStandalone: false, selector: "vdr-facet-detail", usesInheritance: true, ngImport: i0, template: "<vdr-page-block>\n <vdr-action-bar>\n <vdr-ab-left>\n <vdr-language-selector\n [disabled]=\"isNew$ | async\"\n [availableLanguageCodes]=\"availableLanguages$ | async\"\n [currentLanguageCode]=\"languageCode$ | async\"\n (languageCodeChange)=\"setLanguage($event)\"\n ></vdr-language-selector>\n </vdr-ab-left>\n\n <vdr-ab-right>\n <vdr-action-bar-items locationId=\"facet-detail\" />\n <button\n class=\"btn btn-primary\"\n *ngIf=\"isNew$ | async; else updateButton\"\n (click)=\"create()\"\n [disabled]=\"detailForm.invalid || detailForm.pristine\"\n >\n {{ 'common.create' | translate }}\n </button>\n <ng-template #updateButton>\n <button\n *vdrIfPermissions=\"updatePermission\"\n class=\"btn btn-primary\"\n (click)=\"save()\"\n [disabled]=\"detailForm.invalid || detailForm.pristine\"\n >\n {{ 'common.update' | translate }}\n </button>\n </ng-template>\n <vdr-action-bar-dropdown-menu locationId=\"facet-detail\" />\n </vdr-ab-right>\n </vdr-action-bar>\n</vdr-page-block>\n<form class=\"form\" [formGroup]=\"detailForm\">\n <vdr-page-detail-layout>\n <vdr-page-detail-sidebar formGroupName=\"facet\">\n <vdr-card>\n <vdr-form-field [label]=\"'catalog.visibility' | translate\" for=\"visibility\">\n <clr-toggle-wrapper>\n <input\n type=\"checkbox\"\n clrToggle\n [vdrDisabled]=\"!(updatePermission | hasPermission)\"\n formControlName=\"visible\"\n id=\"visibility\"\n />\n <label class=\"visible-toggle\">\n <ng-container *ngIf=\"detailForm.value.facet?.visible; else private\">{{\n 'catalog.public' | translate\n }}</ng-container>\n <ng-template #private>{{ 'catalog.private' | translate }}</ng-template>\n </label>\n </clr-toggle-wrapper>\n </vdr-form-field>\n </vdr-card>\n <vdr-card>\n <vdr-page-entity-info *ngIf=\"entity$ | async as entity\" [entity]=\"entity\" />\n </vdr-card>\n </vdr-page-detail-sidebar>\n <vdr-page-block>\n <vdr-card formGroupName=\"facet\">\n <div class=\"form-grid\">\n <vdr-form-field [label]=\"'common.name' | translate\" for=\"name\">\n <input\n id=\"name\"\n type=\"text\"\n formControlName=\"name\"\n [readonly]=\"!(updatePermission | hasPermission)\"\n (input)=\"updateCode(entity?.code, $event.target.value)\"\n />\n </vdr-form-field>\n <vdr-form-field [label]=\"'common.code' | translate\" for=\"code\">\n <input\n id=\"code\"\n type=\"text\"\n [readonly]=\"!(updatePermission | hasPermission)\"\n formControlName=\"code\"\n />\n </vdr-form-field>\n </div>\n </vdr-card>\n <vdr-card [title]=\"'common.custom-fields' | translate\" *ngIf=\"customFields.length\">\n <vdr-tabbed-custom-fields\n entityName=\"Facet\"\n [customFields]=\"customFields\"\n [customFieldsFormGroup]=\"detailForm.get('facet.customFields')\"\n [readonly]=\"!(updatePermission | hasPermission)\"\n />\n </vdr-card>\n\n <vdr-custom-detail-component-host\n locationId=\"facet-detail\"\n [entity$]=\"entity$\"\n [detailForm]=\"detailForm\"\n ></vdr-custom-detail-component-host>\n\n <vdr-card\n *ngIf=\"!(isNew$ | async)\"\n [title]=\"'catalog.facet-values' | translate\"\n [paddingX]=\"false\"\n >\n <ng-template vdrCardControls>\n <input\n type=\"text\"\n class=\"mr-3\"\n [formControl]=\"filterControl\"\n [placeholder]=\"'catalog.filter-by-name' | translate\"\n />\n </ng-template>\n <ng-container *ngIf=\"values$ | async as filteredValues\">\n <table class=\"facet-values-list table\" formArrayName=\"values\">\n <thead>\n <tr>\n <th></th>\n <th>{{ 'common.name' | translate }}</th>\n <th>{{ 'common.code' | translate }}</th>\n <ng-container *ngIf=\"customValueFields.length\">\n <th>{{ 'common.custom-fields' | translate }}</th>\n </ng-container>\n <th></th>\n </tr>\n </thead>\n <tbody>\n <tr\n class=\"facet-value\"\n *ngFor=\"\n let value of filteredValues\n | paginate\n : {\n currentPage: currentPage,\n itemsPerPage: itemsPerPage,\n totalItems: totalItems,\n };\n let i = index\n \"\n [formGroup]=\"detailForm.get(['values', value.id])\"\n >\n <td class=\"align-middle\">\n <vdr-entity-info [entity]=\"value\"></vdr-entity-info>\n </td>\n <td class=\"align-middle\">\n <input\n type=\"text\"\n formControlName=\"name\"\n [readonly]=\"!(updatePermission | hasPermission)\"\n (input)=\"updateValueCode(value.code, $event.target.value, value.id)\"\n />\n </td>\n <td class=\"align-middle\">\n <input type=\"text\" formControlName=\"code\" />\n </td>\n <td class=\"\" *ngIf=\"customValueFields.length\">\n <vdr-tabbed-custom-fields\n entityName=\"FacetValue\"\n [customFields]=\"customValueFields\"\n [compact]=\"true\"\n [customFieldsFormGroup]=\"\n detailForm.get(['values', value.id, 'customFields'])\n \"\n [readonly]=\"!(updatePermission | hasPermission)\"\n ></vdr-tabbed-custom-fields>\n </td>\n <td class=\"align-middle\">\n <vdr-dropdown>\n <button type=\"button\" class=\"icon-button\" vdrDropdownTrigger>\n <clr-icon shape=\"ellipsis-vertical\"></clr-icon>\n </button>\n <vdr-dropdown-menu vdrPosition=\"bottom-right\">\n <button\n type=\"button\"\n class=\"delete-button\"\n (click)=\"deleteFacetValue(value.id)\"\n [disabled]=\"!(updatePermission | hasPermission)\"\n vdrDropdownItem\n >\n <clr-icon shape=\"trash\" class=\"is-danger\"></clr-icon>\n {{ 'common.delete' | translate }}\n </button>\n </vdr-dropdown-menu>\n </vdr-dropdown>\n </td>\n </tr>\n </tbody>\n </table>\n <div class=\"pagination-wrapper\">\n <vdr-items-per-page-controls\n [itemsPerPage]=\"itemsPerPage\"\n (itemsPerPageChange)=\"setItemsPerPage($event)\"\n ></vdr-items-per-page-controls>\n <vdr-pagination-controls\n [currentPage]=\"currentPage\"\n [itemsPerPage]=\"itemsPerPage\"\n [totalItems]=\"totalItems\"\n (pageChange)=\"setCurrentPage($event)\"\n ></vdr-pagination-controls>\n </div>\n </ng-container>\n <div>\n <button\n type=\"button\"\n class=\"button m-3\"\n *vdrIfPermissions=\"['CreateCatalog', 'CreateFacet']\"\n (click)=\"addFacetValue()\"\n >\n <clr-icon shape=\"add\"></clr-icon>\n {{ 'catalog.add-facet-value' | translate }}\n </button>\n </div>\n </vdr-card>\n </vdr-page-block>\n </vdr-page-detail-layout>\n</form>\n", styles: [".visible-toggle{margin-top:-3px!important}tr.facet-value td{vertical-align:middle}.pagination-wrapper{display:flex;justify-content:space-between;padding:var(--card-padding)}\n"], dependencies: [{ kind: "directive", type: i3.ClrIconCustomTag, selector: "clr-icon" }, { kind: "directive", type: i3.ClrLabel, selector: "label", inputs: ["id", "for"] }, { kind: "directive", type: i3.ClrCheckbox, selector: "[clrCheckbox],[clrToggle]" }, { kind: "component", type: i3.ClrCheckboxWrapper, selector: "clr-checkbox-wrapper,clr-toggle-wrapper" }, { kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i2.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i2.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "component", type: i1.ActionBarComponent, selector: "vdr-action-bar" }, { kind: "component", type: i1.ActionBarLeftComponent, selector: "vdr-ab-left", inputs: ["grow"] }, { kind: "component", type: i1.ActionBarRightComponent, selector: "vdr-ab-right", inputs: ["grow"] }, { kind: "component", type: i1.ActionBarDropdownMenuComponent, selector: "vdr-action-bar-dropdown-menu", inputs: ["alwaysShow"] }, { kind: "component", type: i1.ItemsPerPageControlsComponent, selector: "vdr-items-per-page-controls", inputs: ["itemsPerPage"], outputs: ["itemsPerPageChange"] }, { kind: "component", type: i1.PaginationControlsComponent, selector: "vdr-pagination-controls", inputs: ["id", "currentPage", "itemsPerPage", "totalItems"], outputs: ["pageChange"] }, { kind: "component", type: i1.FormFieldComponent, selector: "vdr-form-field", inputs: ["label", "for", "tooltip", "errors", "readOnlyToggle"], outputs: ["readOnlyToggleChange"] }, { kind: "directive", type: i1.FormFieldControlDirective, selector: "input, textarea, select, vdr-currency-input" }, { kind: "component", type: i1.LanguageSelectorComponent, selector: "vdr-language-selector", inputs: ["currentLanguageCode", "availableLanguageCodes", "disabled"], outputs: ["languageCodeChange"] }, { kind: "component", type: i1.DropdownComponent, selector: "vdr-dropdown", inputs: ["manualToggle"] }, { kind: "component", type: i1.DropdownMenuComponent, selector: "vdr-dropdown-menu", inputs: ["vdrPosition", "customClasses"] }, { kind: "directive", type: i1.DropdownTriggerDirective, selector: "[vdrDropdownTrigger]" }, { kind: "directive", type: i1.DropdownItemDirective, selector: "[vdrDropdownItem]" }, { kind: "directive", type: i1.IfPermissionsDirective, selector: "[vdrIfPermissions]", inputs: ["vdrIfPermissions", "vdrIfPermissionsElse"] }, { kind: "component", type: i1.ActionBarItemsComponent, selector: "vdr-action-bar-items" }, { kind: "directive", type: i1.DisabledDirective, selector: "[vdrDisabled]", inputs: ["vdrDisabled"] }, { kind: "component", type: i1.EntityInfoComponent, selector: "vdr-entity-info", inputs: ["small", "entity"] }, { kind: "component", type: i1.TabbedCustomFieldsComponent, selector: "vdr-tabbed-custom-fields", inputs: ["entityName", "customFields", "customFieldsFormGroup", "readonly", "compact", "showLabel"] }, { kind: "component", type: i1.CustomDetailComponentHostComponent, selector: "vdr-custom-detail-component-host", inputs: ["locationId", "entity$", "detailForm"] }, { kind: "component", type: i1.PageBlockComponent, selector: "vdr-page-block" }, { kind: "component", type: i1.PageEntityInfoComponent, selector: "vdr-page-entity-info", inputs: ["entity"] }, { kind: "component", type: i1.PageDetailLayoutComponent, selector: "vdr-page-detail-layout" }, { kind: "component", type: i1.PageDetailSidebarComponent, selector: "vdr-page-detail-sidebar" }, { kind: "component", type: i1.CardComponent, selector: "vdr-card", inputs: ["title", "paddingX"] }, { kind: "directive", type: i1.CardControlsDirective, selector: "[vdrCardControls]" }, { kind: "pipe", type: i3$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i5$2.PaginatePipe, name: "paginate" }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }, { kind: "pipe", type: i1.HasPermissionPipe, name: "hasPermission" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
3017
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: FacetDetailComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.DataService }, { token: i2.FormBuilder }, { token: i1.NotificationService }, { token: i1.ModalService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3018
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: FacetDetailComponent, isStandalone: false, selector: "vdr-facet-detail", usesInheritance: true, ngImport: i0, template: "<vdr-page-block>\n <vdr-action-bar>\n <vdr-ab-left>\n <vdr-language-selector\n [disabled]=\"isNew$ | async\"\n [availableLanguageCodes]=\"availableLanguages$ | async\"\n [currentLanguageCode]=\"languageCode$ | async\"\n (languageCodeChange)=\"setLanguage($event)\"\n ></vdr-language-selector>\n </vdr-ab-left>\n\n <vdr-ab-right>\n <vdr-action-bar-items locationId=\"facet-detail\" />\n <button\n class=\"btn btn-primary\"\n *ngIf=\"isNew$ | async; else updateButton\"\n (click)=\"create()\"\n [disabled]=\"detailForm.invalid || detailForm.pristine\"\n >\n {{ 'common.create' | translate }}\n </button>\n <ng-template #updateButton>\n <button\n *vdrIfPermissions=\"updatePermission\"\n class=\"btn btn-primary\"\n (click)=\"save()\"\n [disabled]=\"detailForm.invalid || detailForm.pristine\"\n >\n {{ 'common.update' | translate }}\n </button>\n </ng-template>\n <vdr-action-bar-dropdown-menu locationId=\"facet-detail\" />\n </vdr-ab-right>\n </vdr-action-bar>\n</vdr-page-block>\n<form class=\"form\" [formGroup]=\"detailForm\">\n <vdr-page-detail-layout>\n <vdr-page-detail-sidebar formGroupName=\"facet\">\n <vdr-card>\n <vdr-form-field [label]=\"'catalog.visibility' | translate\" for=\"visibility\">\n <clr-toggle-wrapper>\n <input\n type=\"checkbox\"\n clrToggle\n [vdrDisabled]=\"!(updatePermission | hasPermission)\"\n formControlName=\"visible\"\n id=\"visibility\"\n />\n <label class=\"visible-toggle\">\n <ng-container *ngIf=\"detailForm.value.facet?.visible; else private\">{{\n 'catalog.public' | translate\n }}</ng-container>\n <ng-template #private>{{ 'catalog.private' | translate }}</ng-template>\n </label>\n </clr-toggle-wrapper>\n </vdr-form-field>\n </vdr-card>\n <vdr-card>\n <vdr-page-entity-info *ngIf=\"entity$ | async as entity\" [entity]=\"entity\" />\n </vdr-card>\n </vdr-page-detail-sidebar>\n <vdr-page-block>\n <vdr-card formGroupName=\"facet\">\n <div class=\"form-grid\">\n <vdr-form-field [label]=\"'common.name' | translate\" for=\"name\">\n <input\n id=\"name\"\n type=\"text\"\n formControlName=\"name\"\n [readonly]=\"!(updatePermission | hasPermission)\"\n (input)=\"updateCode(entity?.code, $event.target.value)\"\n />\n </vdr-form-field>\n <vdr-form-field [label]=\"'common.code' | translate\" for=\"code\">\n <input\n id=\"code\"\n type=\"text\"\n [readonly]=\"!(updatePermission | hasPermission)\"\n formControlName=\"code\"\n />\n </vdr-form-field>\n </div>\n </vdr-card>\n <vdr-card [title]=\"'common.custom-fields' | translate\" *ngIf=\"customFields.length\">\n <vdr-tabbed-custom-fields\n entityName=\"Facet\"\n [customFields]=\"customFields\"\n [customFieldsFormGroup]=\"detailForm.get('facet.customFields')\"\n [readonly]=\"!(updatePermission | hasPermission)\"\n />\n </vdr-card>\n\n <vdr-custom-detail-component-host\n locationId=\"facet-detail\"\n [entity$]=\"entity$\"\n [detailForm]=\"detailForm\"\n ></vdr-custom-detail-component-host>\n\n <vdr-card\n *ngIf=\"!(isNew$ | async)\"\n [title]=\"'catalog.facet-values' | translate\"\n [paddingX]=\"false\"\n >\n <ng-template vdrCardControls>\n <input\n type=\"text\"\n class=\"mr-3\"\n [formControl]=\"filterControl\"\n [placeholder]=\"'catalog.filter-by-name' | translate\"\n />\n </ng-template>\n <ng-container *ngIf=\"values$ | async as filteredValues\">\n <table class=\"facet-values-list table\" formArrayName=\"values\">\n <thead>\n <tr>\n <th></th>\n <th>{{ 'common.name' | translate }}</th>\n <th>{{ 'common.code' | translate }}</th>\n <ng-container *ngIf=\"customValueFields.length\">\n <th>{{ 'common.custom-fields' | translate }}</th>\n </ng-container>\n <th></th>\n </tr>\n </thead>\n <tbody>\n <tr\n class=\"facet-value\"\n *ngFor=\"\n let value of filteredValues\n | paginate\n : {\n currentPage: currentPage,\n itemsPerPage: itemsPerPage,\n totalItems: totalItems,\n };\n let i = index\n \"\n [formGroup]=\"detailForm.get(['values', value.id])\"\n >\n <td class=\"align-middle\">\n <vdr-entity-info [entity]=\"value\"></vdr-entity-info>\n </td>\n <td class=\"align-middle\">\n <input\n type=\"text\"\n formControlName=\"name\"\n [readonly]=\"!(updatePermission | hasPermission)\"\n (input)=\"updateValueCode(value.code, $event.target.value, value.id)\"\n />\n </td>\n <td class=\"align-middle\">\n <input type=\"text\" formControlName=\"code\" />\n </td>\n <td class=\"\" *ngIf=\"customValueFields.length\">\n <vdr-tabbed-custom-fields\n entityName=\"FacetValue\"\n [customFields]=\"customValueFields\"\n [compact]=\"true\"\n [customFieldsFormGroup]=\"\n detailForm.get(['values', value.id, 'customFields'])\n \"\n [readonly]=\"!(updatePermission | hasPermission)\"\n ></vdr-tabbed-custom-fields>\n </td>\n <td class=\"align-middle\">\n <vdr-dropdown>\n <button type=\"button\" class=\"icon-button\" vdrDropdownTrigger>\n <clr-icon shape=\"ellipsis-vertical\"></clr-icon>\n </button>\n <vdr-dropdown-menu vdrPosition=\"bottom-right\">\n <button\n type=\"button\"\n class=\"delete-button\"\n (click)=\"deleteFacetValue(value.id)\"\n [disabled]=\"!(updatePermission | hasPermission)\"\n vdrDropdownItem\n >\n <clr-icon shape=\"trash\" class=\"is-danger\"></clr-icon>\n {{ 'common.delete' | translate }}\n </button>\n </vdr-dropdown-menu>\n </vdr-dropdown>\n </td>\n </tr>\n </tbody>\n </table>\n <div class=\"pagination-wrapper\">\n <vdr-items-per-page-controls\n [itemsPerPage]=\"itemsPerPage\"\n (itemsPerPageChange)=\"setItemsPerPage($event)\"\n ></vdr-items-per-page-controls>\n <vdr-pagination-controls\n [currentPage]=\"currentPage\"\n [itemsPerPage]=\"itemsPerPage\"\n [totalItems]=\"totalItems\"\n (pageChange)=\"setCurrentPage($event)\"\n ></vdr-pagination-controls>\n </div>\n </ng-container>\n <div>\n <button\n type=\"button\"\n class=\"button m-3\"\n *vdrIfPermissions=\"['CreateCatalog', 'CreateFacet']\"\n (click)=\"addFacetValue()\"\n >\n <clr-icon shape=\"add\"></clr-icon>\n {{ 'catalog.add-facet-value' | translate }}\n </button>\n </div>\n </vdr-card>\n </vdr-page-block>\n </vdr-page-detail-layout>\n</form>\n", styles: [".visible-toggle{margin-top:-3px!important}tr.facet-value td{vertical-align:middle}.pagination-wrapper{display:flex;justify-content:space-between;padding:var(--card-padding)}\n"], dependencies: [{ kind: "directive", type: i3.ClrIconCustomTag, selector: "clr-icon" }, { kind: "directive", type: i3.ClrLabel, selector: "label", inputs: ["id", "for"] }, { kind: "directive", type: i3.ClrCheckbox, selector: "[clrCheckbox],[clrToggle]" }, { kind: "component", type: i3.ClrCheckboxWrapper, selector: "clr-checkbox-wrapper,clr-toggle-wrapper" }, { kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i2.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i2.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "component", type: i1.ActionBarComponent, selector: "vdr-action-bar" }, { kind: "component", type: i1.ActionBarLeftComponent, selector: "vdr-ab-left", inputs: ["grow"] }, { kind: "component", type: i1.ActionBarRightComponent, selector: "vdr-ab-right", inputs: ["grow"] }, { kind: "component", type: i1.ActionBarDropdownMenuComponent, selector: "vdr-action-bar-dropdown-menu", inputs: ["alwaysShow"] }, { kind: "component", type: i1.ItemsPerPageControlsComponent, selector: "vdr-items-per-page-controls", inputs: ["itemsPerPage"], outputs: ["itemsPerPageChange"] }, { kind: "component", type: i1.PaginationControlsComponent, selector: "vdr-pagination-controls", inputs: ["id", "currentPage", "itemsPerPage", "totalItems"], outputs: ["pageChange"] }, { kind: "component", type: i1.FormFieldComponent, selector: "vdr-form-field", inputs: ["label", "for", "tooltip", "errors", "readOnlyToggle"], outputs: ["readOnlyToggleChange"] }, { kind: "directive", type: i1.FormFieldControlDirective, selector: "input, textarea, select, vdr-currency-input" }, { kind: "component", type: i1.LanguageSelectorComponent, selector: "vdr-language-selector", inputs: ["currentLanguageCode", "availableLanguageCodes", "disabled"], outputs: ["languageCodeChange"] }, { kind: "component", type: i1.DropdownComponent, selector: "vdr-dropdown", inputs: ["manualToggle"] }, { kind: "component", type: i1.DropdownMenuComponent, selector: "vdr-dropdown-menu", inputs: ["vdrPosition", "customClasses"] }, { kind: "directive", type: i1.DropdownTriggerDirective, selector: "[vdrDropdownTrigger]" }, { kind: "directive", type: i1.DropdownItemDirective, selector: "[vdrDropdownItem]" }, { kind: "directive", type: i1.IfPermissionsDirective, selector: "[vdrIfPermissions]", inputs: ["vdrIfPermissions", "vdrIfPermissionsElse"] }, { kind: "component", type: i1.ActionBarItemsComponent, selector: "vdr-action-bar-items" }, { kind: "directive", type: i1.DisabledDirective, selector: "[vdrDisabled]", inputs: ["vdrDisabled"] }, { kind: "component", type: i1.EntityInfoComponent, selector: "vdr-entity-info", inputs: ["small", "entity"] }, { kind: "component", type: i1.TabbedCustomFieldsComponent, selector: "vdr-tabbed-custom-fields", inputs: ["entityName", "customFields", "customFieldsFormGroup", "readonly", "compact", "showLabel"] }, { kind: "component", type: i1.CustomDetailComponentHostComponent, selector: "vdr-custom-detail-component-host", inputs: ["locationId", "entity$", "detailForm"] }, { kind: "component", type: i1.PageBlockComponent, selector: "vdr-page-block" }, { kind: "component", type: i1.PageEntityInfoComponent, selector: "vdr-page-entity-info", inputs: ["entity"] }, { kind: "component", type: i1.PageDetailLayoutComponent, selector: "vdr-page-detail-layout" }, { kind: "component", type: i1.PageDetailSidebarComponent, selector: "vdr-page-detail-sidebar" }, { kind: "component", type: i1.CardComponent, selector: "vdr-card", inputs: ["title", "paddingX"] }, { kind: "directive", type: i1.CardControlsDirective, selector: "[vdrCardControls]" }, { kind: "pipe", type: i3$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i5$2.PaginatePipe, name: "paginate" }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }, { kind: "pipe", type: i1.HasPermissionPipe, name: "hasPermission" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
3019
3019
|
}
|
|
3020
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
3020
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: FacetDetailComponent, decorators: [{
|
|
3021
3021
|
type: Component,
|
|
3022
3022
|
args: [{ selector: 'vdr-facet-detail', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<vdr-page-block>\n <vdr-action-bar>\n <vdr-ab-left>\n <vdr-language-selector\n [disabled]=\"isNew$ | async\"\n [availableLanguageCodes]=\"availableLanguages$ | async\"\n [currentLanguageCode]=\"languageCode$ | async\"\n (languageCodeChange)=\"setLanguage($event)\"\n ></vdr-language-selector>\n </vdr-ab-left>\n\n <vdr-ab-right>\n <vdr-action-bar-items locationId=\"facet-detail\" />\n <button\n class=\"btn btn-primary\"\n *ngIf=\"isNew$ | async; else updateButton\"\n (click)=\"create()\"\n [disabled]=\"detailForm.invalid || detailForm.pristine\"\n >\n {{ 'common.create' | translate }}\n </button>\n <ng-template #updateButton>\n <button\n *vdrIfPermissions=\"updatePermission\"\n class=\"btn btn-primary\"\n (click)=\"save()\"\n [disabled]=\"detailForm.invalid || detailForm.pristine\"\n >\n {{ 'common.update' | translate }}\n </button>\n </ng-template>\n <vdr-action-bar-dropdown-menu locationId=\"facet-detail\" />\n </vdr-ab-right>\n </vdr-action-bar>\n</vdr-page-block>\n<form class=\"form\" [formGroup]=\"detailForm\">\n <vdr-page-detail-layout>\n <vdr-page-detail-sidebar formGroupName=\"facet\">\n <vdr-card>\n <vdr-form-field [label]=\"'catalog.visibility' | translate\" for=\"visibility\">\n <clr-toggle-wrapper>\n <input\n type=\"checkbox\"\n clrToggle\n [vdrDisabled]=\"!(updatePermission | hasPermission)\"\n formControlName=\"visible\"\n id=\"visibility\"\n />\n <label class=\"visible-toggle\">\n <ng-container *ngIf=\"detailForm.value.facet?.visible; else private\">{{\n 'catalog.public' | translate\n }}</ng-container>\n <ng-template #private>{{ 'catalog.private' | translate }}</ng-template>\n </label>\n </clr-toggle-wrapper>\n </vdr-form-field>\n </vdr-card>\n <vdr-card>\n <vdr-page-entity-info *ngIf=\"entity$ | async as entity\" [entity]=\"entity\" />\n </vdr-card>\n </vdr-page-detail-sidebar>\n <vdr-page-block>\n <vdr-card formGroupName=\"facet\">\n <div class=\"form-grid\">\n <vdr-form-field [label]=\"'common.name' | translate\" for=\"name\">\n <input\n id=\"name\"\n type=\"text\"\n formControlName=\"name\"\n [readonly]=\"!(updatePermission | hasPermission)\"\n (input)=\"updateCode(entity?.code, $event.target.value)\"\n />\n </vdr-form-field>\n <vdr-form-field [label]=\"'common.code' | translate\" for=\"code\">\n <input\n id=\"code\"\n type=\"text\"\n [readonly]=\"!(updatePermission | hasPermission)\"\n formControlName=\"code\"\n />\n </vdr-form-field>\n </div>\n </vdr-card>\n <vdr-card [title]=\"'common.custom-fields' | translate\" *ngIf=\"customFields.length\">\n <vdr-tabbed-custom-fields\n entityName=\"Facet\"\n [customFields]=\"customFields\"\n [customFieldsFormGroup]=\"detailForm.get('facet.customFields')\"\n [readonly]=\"!(updatePermission | hasPermission)\"\n />\n </vdr-card>\n\n <vdr-custom-detail-component-host\n locationId=\"facet-detail\"\n [entity$]=\"entity$\"\n [detailForm]=\"detailForm\"\n ></vdr-custom-detail-component-host>\n\n <vdr-card\n *ngIf=\"!(isNew$ | async)\"\n [title]=\"'catalog.facet-values' | translate\"\n [paddingX]=\"false\"\n >\n <ng-template vdrCardControls>\n <input\n type=\"text\"\n class=\"mr-3\"\n [formControl]=\"filterControl\"\n [placeholder]=\"'catalog.filter-by-name' | translate\"\n />\n </ng-template>\n <ng-container *ngIf=\"values$ | async as filteredValues\">\n <table class=\"facet-values-list table\" formArrayName=\"values\">\n <thead>\n <tr>\n <th></th>\n <th>{{ 'common.name' | translate }}</th>\n <th>{{ 'common.code' | translate }}</th>\n <ng-container *ngIf=\"customValueFields.length\">\n <th>{{ 'common.custom-fields' | translate }}</th>\n </ng-container>\n <th></th>\n </tr>\n </thead>\n <tbody>\n <tr\n class=\"facet-value\"\n *ngFor=\"\n let value of filteredValues\n | paginate\n : {\n currentPage: currentPage,\n itemsPerPage: itemsPerPage,\n totalItems: totalItems,\n };\n let i = index\n \"\n [formGroup]=\"detailForm.get(['values', value.id])\"\n >\n <td class=\"align-middle\">\n <vdr-entity-info [entity]=\"value\"></vdr-entity-info>\n </td>\n <td class=\"align-middle\">\n <input\n type=\"text\"\n formControlName=\"name\"\n [readonly]=\"!(updatePermission | hasPermission)\"\n (input)=\"updateValueCode(value.code, $event.target.value, value.id)\"\n />\n </td>\n <td class=\"align-middle\">\n <input type=\"text\" formControlName=\"code\" />\n </td>\n <td class=\"\" *ngIf=\"customValueFields.length\">\n <vdr-tabbed-custom-fields\n entityName=\"FacetValue\"\n [customFields]=\"customValueFields\"\n [compact]=\"true\"\n [customFieldsFormGroup]=\"\n detailForm.get(['values', value.id, 'customFields'])\n \"\n [readonly]=\"!(updatePermission | hasPermission)\"\n ></vdr-tabbed-custom-fields>\n </td>\n <td class=\"align-middle\">\n <vdr-dropdown>\n <button type=\"button\" class=\"icon-button\" vdrDropdownTrigger>\n <clr-icon shape=\"ellipsis-vertical\"></clr-icon>\n </button>\n <vdr-dropdown-menu vdrPosition=\"bottom-right\">\n <button\n type=\"button\"\n class=\"delete-button\"\n (click)=\"deleteFacetValue(value.id)\"\n [disabled]=\"!(updatePermission | hasPermission)\"\n vdrDropdownItem\n >\n <clr-icon shape=\"trash\" class=\"is-danger\"></clr-icon>\n {{ 'common.delete' | translate }}\n </button>\n </vdr-dropdown-menu>\n </vdr-dropdown>\n </td>\n </tr>\n </tbody>\n </table>\n <div class=\"pagination-wrapper\">\n <vdr-items-per-page-controls\n [itemsPerPage]=\"itemsPerPage\"\n (itemsPerPageChange)=\"setItemsPerPage($event)\"\n ></vdr-items-per-page-controls>\n <vdr-pagination-controls\n [currentPage]=\"currentPage\"\n [itemsPerPage]=\"itemsPerPage\"\n [totalItems]=\"totalItems\"\n (pageChange)=\"setCurrentPage($event)\"\n ></vdr-pagination-controls>\n </div>\n </ng-container>\n <div>\n <button\n type=\"button\"\n class=\"button m-3\"\n *vdrIfPermissions=\"['CreateCatalog', 'CreateFacet']\"\n (click)=\"addFacetValue()\"\n >\n <clr-icon shape=\"add\"></clr-icon>\n {{ 'catalog.add-facet-value' | translate }}\n </button>\n </div>\n </vdr-card>\n </vdr-page-block>\n </vdr-page-detail-layout>\n</form>\n", styles: [".visible-toggle{margin-top:-3px!important}tr.facet-value td{vertical-align:middle}.pagination-wrapper{display:flex;justify-content:space-between;padding:var(--card-padding)}\n"] }]
|
|
3023
3023
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1.DataService }, { type: i2.FormBuilder }, { type: i1.NotificationService }, { type: i1.ModalService }] });
|
|
@@ -3239,10 +3239,10 @@ class FacetListComponent extends TypedBaseListComponent {
|
|
|
3239
3239
|
setLanguage(code) {
|
|
3240
3240
|
this.dataService.client.setContentLanguage(code).subscribe();
|
|
3241
3241
|
}
|
|
3242
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
3243
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
3242
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: FacetListComponent, deps: [{ token: i1.DataService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3243
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: FacetListComponent, isStandalone: false, selector: "vdr-facet-list", usesInheritance: true, ngImport: i0, template: "<vdr-page-block>\n <vdr-action-bar>\n <vdr-ab-left>\n <vdr-language-selector\n [availableLanguageCodes]=\"availableLanguages$ | async\"\n [currentLanguageCode]=\"contentLanguage$ | async\"\n (languageCodeChange)=\"setLanguage($event)\"\n ></vdr-language-selector>\n </vdr-ab-left>\n <vdr-ab-right>\n <vdr-action-bar-items locationId=\"facet-list\" />\n <a\n class=\"btn btn-primary\"\n [routerLink]=\"['./create']\"\n *vdrIfPermissions=\"['CreateCatalog', 'CreateFacet']\"\n >\n <clr-icon shape=\"plus\"></clr-icon>\n {{ 'catalog.create-new-facet' | translate }}\n </a>\n <vdr-action-bar-dropdown-menu locationId=\"facet-list\" />\n </vdr-ab-right>\n </vdr-action-bar>\n</vdr-page-block>\n<vdr-data-table-2\n class=\"mt-2\"\n [id]=\"dataTableListId\"\n [items]=\"items$ | async\"\n [itemsPerPage]=\"itemsPerPage$ | async\"\n [totalItems]=\"totalItems$ | async\"\n [currentPage]=\"currentPage$ | async\"\n [filters]=\"filters\"\n (pageChange)=\"setPageNumber($event)\"\n (itemsPerPageChange)=\"setItemsPerPage($event)\"\n (visibleColumnsChange)=\"setVisibleColumns($event)\"\n>\n <vdr-bulk-action-menu\n locationId=\"facet-list\"\n [hostComponent]=\"this\"\n [selectionManager]=\"selectionManager\"\n ></vdr-bulk-action-menu>\n <vdr-dt2-search\n [searchTermControl]=\"searchTermControl\"\n [searchTermPlaceholder]=\"'catalog.filter-by-name' | translate\"\n ></vdr-dt2-search>\n <vdr-dt2-column [heading]=\"'common.id' | translate\" id=\"id\" [hiddenByDefault]=\"true\" [sort]=\"sorts.get('id')\">\n <ng-template let-facet=\"item\">\n {{ facet.id }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column\n [heading]=\"'common.created-at' | translate\" id=\"created-at\"\n [hiddenByDefault]=\"true\"\n [sort]=\"sorts.get('createdAt')\"\n >\n <ng-template let-facet=\"item\">\n {{ facet.createdAt | localeDate : 'short' }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column\n [heading]=\"'common.updated-at' | translate\" id=\"updated-at\"\n [hiddenByDefault]=\"true\"\n [sort]=\"sorts.get('updatedAt')\"\n >\n <ng-template let-facet=\"item\">\n {{ facet.updatedAt | localeDate : 'short' }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.name' | translate\" id=\"name\" [optional]=\"false\" [sort]=\"sorts.get('name')\">\n <ng-template let-facet=\"item\">\n <a class=\"button-ghost\" [routerLink]=\"['./', facet.id]\"\n ><span>{{ facet.name }}</span>\n <clr-icon shape=\"arrow right\"></clr-icon>\n </a>\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.code' | translate\" id=\"code\">\n <ng-template let-facet=\"item\">\n {{ facet.code }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.visibility' | translate\" id=\"visibility\">\n <ng-template let-facet=\"item\">\n <vdr-chip *ngIf=\"facet.isPrivate\" colorType=\"warning\">{{\n 'common.private' | translate\n }}</vdr-chip>\n <vdr-chip *ngIf=\"!facet.isPrivate\" colorType=\"success\">{{\n 'common.public' | translate\n }}</vdr-chip>\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'catalog.values' | translate\" id=\"values\">\n <ng-template let-facet=\"item\">\n <div class=\"facet-values-list\">\n <vdr-facet-value-chip\n *ngFor=\"let value of facet.valueList.items | slice : 0 : displayLimit[facet.id] || 3\"\n [facetValue]=\"value\"\n [removable]=\"false\"\n [displayFacetName]=\"false\"\n ></vdr-facet-value-chip>\n <vdr-chip *ngIf=\"displayLimit[facet.id] < facet.valueList.totalItems && (displayLimit[facet.id] || 0) === facet.valueList.items.length\">\n ... + {{ facet.valueList.totalItems - facet.valueList.items.length }}\n </vdr-chip>\n <button\n class=\"button-small\"\n *ngIf=\"facet.valueList.items.length > initialLimit\"\n (click)=\"toggleDisplayLimit(facet)\"\n >\n <ng-container *ngIf=\"(displayLimit[facet.id] || 0) < facet.valueList.items.length; else collapse\">\n <clr-icon shape=\"plus\"></clr-icon>\n {{ facet.valueList.totalItems - initialLimit }}\n </ng-container>\n <ng-template #collapse>\n <clr-icon shape=\"minus\"></clr-icon>\n </ng-template>\n </button>\n </div>\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-custom-field-column *ngFor=\"let customField of customFields\" [customField]=\"customField\" [sorts]=\"sorts\" />\n</vdr-data-table-2>\n", styles: [".facet-values-list{max-width:500px;display:flex;flex-wrap:wrap;align-items:center;gap:4px}\n"], dependencies: [{ kind: "directive", type: i3.ClrIconCustomTag, selector: "clr-icon" }, { kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i1.ActionBarComponent, selector: "vdr-action-bar" }, { kind: "component", type: i1.ActionBarLeftComponent, selector: "vdr-ab-left", inputs: ["grow"] }, { kind: "component", type: i1.ActionBarRightComponent, selector: "vdr-ab-right", inputs: ["grow"] }, { kind: "component", type: i1.ActionBarDropdownMenuComponent, selector: "vdr-action-bar-dropdown-menu", inputs: ["alwaysShow"] }, { kind: "component", type: i1.ChipComponent, selector: "vdr-chip", inputs: ["icon", "invert", "colorFrom", "colorType"], outputs: ["iconClick"] }, { kind: "component", type: i1.FacetValueChipComponent, selector: "vdr-facet-value-chip", inputs: ["facetValue", "removable", "displayFacetName"], outputs: ["remove"] }, { kind: "component", type: i1.LanguageSelectorComponent, selector: "vdr-language-selector", inputs: ["currentLanguageCode", "availableLanguageCodes", "disabled"], outputs: ["languageCodeChange"] }, { kind: "directive", type: i1.IfPermissionsDirective, selector: "[vdrIfPermissions]", inputs: ["vdrIfPermissions", "vdrIfPermissionsElse"] }, { kind: "component", type: i1.ActionBarItemsComponent, selector: "vdr-action-bar-items" }, { kind: "component", type: i1.BulkActionMenuComponent, selector: "vdr-bulk-action-menu", inputs: ["locationId", "selectionManager", "hostComponent"] }, { kind: "component", type: i1.DataTable2Component, selector: "vdr-data-table-2", inputs: ["id", "items", "itemsPerPage", "currentPage", "totalItems", "emptyStateLabel", "filters", "activeIndex", "trackByPath"], outputs: ["pageChange", "itemsPerPageChange", "visibleColumnsChange"] }, { kind: "component", type: i1.DataTable2ColumnComponent, selector: "vdr-dt2-column", inputs: ["id", "expand", "heading", "align", "sort", "optional", "hiddenByDefault", "orderable"], exportAs: ["row"] }, { kind: "component", type: i1.DataTable2SearchComponent, selector: "vdr-dt2-search", inputs: ["searchTermControl", "searchTermPlaceholder"] }, { kind: "component", type: i1.DataTableCustomFieldColumnComponent, selector: "vdr-dt2-custom-field-column", inputs: ["customField", "sorts"], exportAs: ["row"] }, { kind: "component", type: i1.PageBlockComponent, selector: "vdr-page-block" }, { kind: "pipe", type: i3$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i3$1.SlicePipe, name: "slice" }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }, { kind: "pipe", type: i1.LocaleDatePipe, name: "localeDate" }] }); }
|
|
3244
3244
|
}
|
|
3245
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
3245
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: FacetListComponent, decorators: [{
|
|
3246
3246
|
type: Component,
|
|
3247
3247
|
args: [{ selector: 'vdr-facet-list', standalone: false, template: "<vdr-page-block>\n <vdr-action-bar>\n <vdr-ab-left>\n <vdr-language-selector\n [availableLanguageCodes]=\"availableLanguages$ | async\"\n [currentLanguageCode]=\"contentLanguage$ | async\"\n (languageCodeChange)=\"setLanguage($event)\"\n ></vdr-language-selector>\n </vdr-ab-left>\n <vdr-ab-right>\n <vdr-action-bar-items locationId=\"facet-list\" />\n <a\n class=\"btn btn-primary\"\n [routerLink]=\"['./create']\"\n *vdrIfPermissions=\"['CreateCatalog', 'CreateFacet']\"\n >\n <clr-icon shape=\"plus\"></clr-icon>\n {{ 'catalog.create-new-facet' | translate }}\n </a>\n <vdr-action-bar-dropdown-menu locationId=\"facet-list\" />\n </vdr-ab-right>\n </vdr-action-bar>\n</vdr-page-block>\n<vdr-data-table-2\n class=\"mt-2\"\n [id]=\"dataTableListId\"\n [items]=\"items$ | async\"\n [itemsPerPage]=\"itemsPerPage$ | async\"\n [totalItems]=\"totalItems$ | async\"\n [currentPage]=\"currentPage$ | async\"\n [filters]=\"filters\"\n (pageChange)=\"setPageNumber($event)\"\n (itemsPerPageChange)=\"setItemsPerPage($event)\"\n (visibleColumnsChange)=\"setVisibleColumns($event)\"\n>\n <vdr-bulk-action-menu\n locationId=\"facet-list\"\n [hostComponent]=\"this\"\n [selectionManager]=\"selectionManager\"\n ></vdr-bulk-action-menu>\n <vdr-dt2-search\n [searchTermControl]=\"searchTermControl\"\n [searchTermPlaceholder]=\"'catalog.filter-by-name' | translate\"\n ></vdr-dt2-search>\n <vdr-dt2-column [heading]=\"'common.id' | translate\" id=\"id\" [hiddenByDefault]=\"true\" [sort]=\"sorts.get('id')\">\n <ng-template let-facet=\"item\">\n {{ facet.id }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column\n [heading]=\"'common.created-at' | translate\" id=\"created-at\"\n [hiddenByDefault]=\"true\"\n [sort]=\"sorts.get('createdAt')\"\n >\n <ng-template let-facet=\"item\">\n {{ facet.createdAt | localeDate : 'short' }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column\n [heading]=\"'common.updated-at' | translate\" id=\"updated-at\"\n [hiddenByDefault]=\"true\"\n [sort]=\"sorts.get('updatedAt')\"\n >\n <ng-template let-facet=\"item\">\n {{ facet.updatedAt | localeDate : 'short' }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.name' | translate\" id=\"name\" [optional]=\"false\" [sort]=\"sorts.get('name')\">\n <ng-template let-facet=\"item\">\n <a class=\"button-ghost\" [routerLink]=\"['./', facet.id]\"\n ><span>{{ facet.name }}</span>\n <clr-icon shape=\"arrow right\"></clr-icon>\n </a>\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.code' | translate\" id=\"code\">\n <ng-template let-facet=\"item\">\n {{ facet.code }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.visibility' | translate\" id=\"visibility\">\n <ng-template let-facet=\"item\">\n <vdr-chip *ngIf=\"facet.isPrivate\" colorType=\"warning\">{{\n 'common.private' | translate\n }}</vdr-chip>\n <vdr-chip *ngIf=\"!facet.isPrivate\" colorType=\"success\">{{\n 'common.public' | translate\n }}</vdr-chip>\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'catalog.values' | translate\" id=\"values\">\n <ng-template let-facet=\"item\">\n <div class=\"facet-values-list\">\n <vdr-facet-value-chip\n *ngFor=\"let value of facet.valueList.items | slice : 0 : displayLimit[facet.id] || 3\"\n [facetValue]=\"value\"\n [removable]=\"false\"\n [displayFacetName]=\"false\"\n ></vdr-facet-value-chip>\n <vdr-chip *ngIf=\"displayLimit[facet.id] < facet.valueList.totalItems && (displayLimit[facet.id] || 0) === facet.valueList.items.length\">\n ... + {{ facet.valueList.totalItems - facet.valueList.items.length }}\n </vdr-chip>\n <button\n class=\"button-small\"\n *ngIf=\"facet.valueList.items.length > initialLimit\"\n (click)=\"toggleDisplayLimit(facet)\"\n >\n <ng-container *ngIf=\"(displayLimit[facet.id] || 0) < facet.valueList.items.length; else collapse\">\n <clr-icon shape=\"plus\"></clr-icon>\n {{ facet.valueList.totalItems - initialLimit }}\n </ng-container>\n <ng-template #collapse>\n <clr-icon shape=\"minus\"></clr-icon>\n </ng-template>\n </button>\n </div>\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-custom-field-column *ngFor=\"let customField of customFields\" [customField]=\"customField\" [sorts]=\"sorts\" />\n</vdr-data-table-2>\n", styles: [".facet-values-list{max-width:500px;display:flex;flex-wrap:wrap;align-items:center;gap:4px}\n"] }]
|
|
3248
3248
|
}], ctorParameters: () => [{ type: i1.DataService }] });
|
|
@@ -3356,10 +3356,10 @@ class GenerateProductVariantsComponent {
|
|
|
3356
3356
|
? this.variantFormValues[DEFAULT_VARIANT_CODE].get(prop)?.value
|
|
3357
3357
|
: value;
|
|
3358
3358
|
}
|
|
3359
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
3360
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
3359
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: GenerateProductVariantsComponent, deps: [{ token: i1.DataService }, { token: i2.FormBuilder }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3360
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: GenerateProductVariantsComponent, isStandalone: false, selector: "vdr-generate-product-variants", outputs: { variantsChange: "variantsChange" }, viewQueries: [{ propertyName: "groupNameInputs", predicate: ["optionGroupName"], descendants: true, read: ElementRef }], ngImport: i0, template: "<div *ngFor=\"let group of optionGroups\" class=\"option-groups\">\n <div class=\"name\">\n <label>{{ 'catalog.option' | translate }}</label>\n <input\n #optionGroupName\n placeholder=\"e.g. Size\"\n clrInput\n [(ngModel)]=\"group.name\"\n name=\"name\"\n required\n (keydown.enter)=\"handleEnter($event, optionValueInputComponent)\"\n />\n </div>\n <div class=\"values\">\n <label>{{ 'catalog.option-values' | translate }}</label>\n <vdr-option-value-input\n #optionValueInputComponent\n [(ngModel)]=\"group.values\"\n (ngModelChange)=\"generateVariants()\"\n (edit)=\"generateVariants()\"\n [groupName]=\"group.name\"\n [disabled]=\"group.name === ''\"\n ></vdr-option-value-input>\n </div>\n <div class=\"remove-group\">\n <button\n class=\"button-small mt-2\"\n [title]=\"'catalog.remove-option' | translate\"\n (click)=\"removeOption(group.name)\"\n >\n <clr-icon shape=\"trash\"></clr-icon>\n </button>\n </div>\n</div>\n<button class=\"button mb-2\" (click)=\"addOption()\">\n <clr-icon shape=\"plus\"></clr-icon>\n {{ 'catalog.add-option' | translate }}\n</button>\n\n<ng-container *ngIf=\"stockLocations$ | async as stockLocations\">\n <clr-alert *ngIf=\"stockLocations.length === 0\" clrAlertType=\"warning\" [clrAlertClosable]=\"false\" class=\"\">\n <clr-alert-item>\n <span class=\"alert-text\">\n {{ 'catalog.no-stock-locations-available-on-current-channel' | translate }}\n </span>\n </clr-alert-item>\n </clr-alert>\n\n <div class=\"form-grid mb-2\">\n <vdr-form-field *ngIf=\"stockLocations.length\" [label]=\"'catalog.add-stock-to-location' | translate\">\n <select [(ngModel)]=\"selectedStockLocationId\">\n <option *ngFor=\"let location of stockLocations\" [value]=\"location.id\">\n {{ location.name }}\n </option>\n </select>\n </vdr-form-field>\n </div>\n\n <div class=\"variants-preview\" *ngIf=\"0 < stockLocations.length\">\n <table class=\"table\">\n <thead>\n <tr>\n <th *ngIf=\"1 < variants.length\">{{ 'common.create' | translate }}</th>\n <th *ngIf=\"1 < variants.length\">{{ 'catalog.variant' | translate }}</th>\n <th>{{ 'catalog.sku' | translate }}</th>\n <th>{{ 'catalog.price' | translate }}</th>\n <th>{{ 'catalog.stock-on-hand' | translate }}</th>\n </tr>\n </thead>\n <tr\n *ngFor=\"let variant of variants; trackBy: trackByFn\"\n [class.disabled]=\"!variantFormValues[variant.id].value.enabled === false\"\n [formGroup]=\"variantFormValues[variant.id]\"\n >\n <td *ngIf=\"1 < variants.length\">\n <input type=\"checkbox\" formControlName=\"enabled\" clrCheckbox />\n </td>\n <td *ngIf=\"1 < variants.length\">\n {{ variant.values.join(' ') }}\n </td>\n <td>\n <vdr-form-field>\n <input type=\"text\" formControlName=\"sku\" [placeholder]=\"'catalog.sku' | translate\" />\n </vdr-form-field>\n </td>\n <td>\n <vdr-form-field>\n <vdr-currency-input\n formControlName=\"price\"\n [currencyCode]=\"currencyCode\"\n ></vdr-currency-input>\n </vdr-form-field>\n </td>\n <td>\n <vdr-form-field>\n <input type=\"number\" formControlName=\"stock\" min=\"0\" step=\"1\" />\n </vdr-form-field>\n </td>\n </tr>\n </table>\n </div>\n</ng-container>\n", styles: [":host{display:block;margin-bottom:120px}.option-groups{display:flex}.values{flex:1;margin:0 6px}.remove-group{padding-top:18px}.variants-preview tr.disabled td{background-color:var(--color-component-bg-100);color:var(--color-grey-400)}\n"], dependencies: [{ kind: "component", type: i3.ClrAlert, selector: "clr-alert", inputs: ["clrAlertSizeSmall", "clrAlertClosable", "clrAlertAppLevel", "clrCloseButtonAriaLabel", "clrAlertLightweight", "clrAlertType", "clrAlertIcon", "clrAlertClosed"], outputs: ["clrAlertClosedChange"] }, { kind: "component", type: i3.ClrAlertItem, selector: "clr-alert-item" }, { kind: "directive", type: i3.ClrAlertText, selector: ".alert-text" }, { kind: "directive", type: i3.ClrIconCustomTag, selector: "clr-icon" }, { kind: "directive", type: i3.ClrLabel, selector: "label", inputs: ["id", "for"] }, { kind: "directive", type: i3.ClrCheckbox, selector: "[clrCheckbox],[clrToggle]" }, { kind: "directive", type: i3.ClrInput, selector: "[clrInput]" }, { kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i2.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i1.CurrencyInputComponent, selector: "vdr-currency-input", inputs: ["disabled", "readonly", "value", "currencyCode"], outputs: ["valueChange"] }, { kind: "component", type: i1.FormFieldComponent, selector: "vdr-form-field", inputs: ["label", "for", "tooltip", "errors", "readOnlyToggle"], outputs: ["readOnlyToggleChange"] }, { kind: "directive", type: i1.FormFieldControlDirective, selector: "input, textarea, select, vdr-currency-input" }, { kind: "component", type: OptionValueInputComponent, selector: "vdr-option-value-input", inputs: ["groupName", "options", "disabled"], outputs: ["add", "remove", "edit"] }, { kind: "pipe", type: i3$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }] }); }
|
|
3361
3361
|
}
|
|
3362
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
3362
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: GenerateProductVariantsComponent, decorators: [{
|
|
3363
3363
|
type: Component,
|
|
3364
3364
|
args: [{ selector: 'vdr-generate-product-variants', standalone: false, template: "<div *ngFor=\"let group of optionGroups\" class=\"option-groups\">\n <div class=\"name\">\n <label>{{ 'catalog.option' | translate }}</label>\n <input\n #optionGroupName\n placeholder=\"e.g. Size\"\n clrInput\n [(ngModel)]=\"group.name\"\n name=\"name\"\n required\n (keydown.enter)=\"handleEnter($event, optionValueInputComponent)\"\n />\n </div>\n <div class=\"values\">\n <label>{{ 'catalog.option-values' | translate }}</label>\n <vdr-option-value-input\n #optionValueInputComponent\n [(ngModel)]=\"group.values\"\n (ngModelChange)=\"generateVariants()\"\n (edit)=\"generateVariants()\"\n [groupName]=\"group.name\"\n [disabled]=\"group.name === ''\"\n ></vdr-option-value-input>\n </div>\n <div class=\"remove-group\">\n <button\n class=\"button-small mt-2\"\n [title]=\"'catalog.remove-option' | translate\"\n (click)=\"removeOption(group.name)\"\n >\n <clr-icon shape=\"trash\"></clr-icon>\n </button>\n </div>\n</div>\n<button class=\"button mb-2\" (click)=\"addOption()\">\n <clr-icon shape=\"plus\"></clr-icon>\n {{ 'catalog.add-option' | translate }}\n</button>\n\n<ng-container *ngIf=\"stockLocations$ | async as stockLocations\">\n <clr-alert *ngIf=\"stockLocations.length === 0\" clrAlertType=\"warning\" [clrAlertClosable]=\"false\" class=\"\">\n <clr-alert-item>\n <span class=\"alert-text\">\n {{ 'catalog.no-stock-locations-available-on-current-channel' | translate }}\n </span>\n </clr-alert-item>\n </clr-alert>\n\n <div class=\"form-grid mb-2\">\n <vdr-form-field *ngIf=\"stockLocations.length\" [label]=\"'catalog.add-stock-to-location' | translate\">\n <select [(ngModel)]=\"selectedStockLocationId\">\n <option *ngFor=\"let location of stockLocations\" [value]=\"location.id\">\n {{ location.name }}\n </option>\n </select>\n </vdr-form-field>\n </div>\n\n <div class=\"variants-preview\" *ngIf=\"0 < stockLocations.length\">\n <table class=\"table\">\n <thead>\n <tr>\n <th *ngIf=\"1 < variants.length\">{{ 'common.create' | translate }}</th>\n <th *ngIf=\"1 < variants.length\">{{ 'catalog.variant' | translate }}</th>\n <th>{{ 'catalog.sku' | translate }}</th>\n <th>{{ 'catalog.price' | translate }}</th>\n <th>{{ 'catalog.stock-on-hand' | translate }}</th>\n </tr>\n </thead>\n <tr\n *ngFor=\"let variant of variants; trackBy: trackByFn\"\n [class.disabled]=\"!variantFormValues[variant.id].value.enabled === false\"\n [formGroup]=\"variantFormValues[variant.id]\"\n >\n <td *ngIf=\"1 < variants.length\">\n <input type=\"checkbox\" formControlName=\"enabled\" clrCheckbox />\n </td>\n <td *ngIf=\"1 < variants.length\">\n {{ variant.values.join(' ') }}\n </td>\n <td>\n <vdr-form-field>\n <input type=\"text\" formControlName=\"sku\" [placeholder]=\"'catalog.sku' | translate\" />\n </vdr-form-field>\n </td>\n <td>\n <vdr-form-field>\n <vdr-currency-input\n formControlName=\"price\"\n [currencyCode]=\"currencyCode\"\n ></vdr-currency-input>\n </vdr-form-field>\n </td>\n <td>\n <vdr-form-field>\n <input type=\"number\" formControlName=\"stock\" min=\"0\" step=\"1\" />\n </vdr-form-field>\n </td>\n </tr>\n </table>\n </div>\n</ng-container>\n", styles: [":host{display:block;margin-bottom:120px}.option-groups{display:flex}.values{flex:1;margin:0 6px}.remove-group{padding-top:18px}.variants-preview tr.disabled td{background-color:var(--color-component-bg-100);color:var(--color-grey-400)}\n"] }]
|
|
3365
3365
|
}], ctorParameters: () => [{ type: i1.DataService }, { type: i2.FormBuilder }], propDecorators: { variantsChange: [{
|
|
@@ -3465,10 +3465,10 @@ class ProductVariantListComponent extends TypedBaseListComponent {
|
|
|
3465
3465
|
refreshListOnChanges: [this.sorts.valueChanges, this.filters.valueChanges],
|
|
3466
3466
|
});
|
|
3467
3467
|
}
|
|
3468
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
3469
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
3468
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ProductVariantListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3469
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: ProductVariantListComponent, isStandalone: false, selector: "vdr-product-variant-list", inputs: { productId: "productId", hideLanguageSelect: "hideLanguageSelect", dataTableId: "dataTableId" }, usesInheritance: true, ngImport: i0, template: "<vdr-page-block>\n <vdr-action-bar>\n <vdr-ab-left>\n <vdr-language-selector *ngIf=\"!hideLanguageSelect\"\n [availableLanguageCodes]=\"availableLanguages$ | async\"\n [currentLanguageCode]=\"contentLanguage$ | async\"\n (languageCodeChange)=\"setLanguage($event)\"\n ></vdr-language-selector>\n </vdr-ab-left>\n <vdr-ab-right>\n <vdr-action-bar-items [locationId]=\"pageLocationId\" />\n <vdr-action-bar-dropdown-menu [locationId]=\"pageLocationId\" />\n </vdr-ab-right>\n </vdr-action-bar>\n</vdr-page-block>\n<vdr-data-table-2\n class=\"mt-2\"\n [id]=\"dataTableId || 'product-variant-list'\"\n [items]=\"items$ | async\"\n [itemsPerPage]=\"itemsPerPage$ | async\"\n [totalItems]=\"totalItems$ | async\"\n [currentPage]=\"currentPage$ | async\"\n [filters]=\"filters\"\n (pageChange)=\"setPageNumber($event)\"\n (itemsPerPageChange)=\"setItemsPerPage($event)\"\n>\n <vdr-bulk-action-menu\n locationId=\"product-variant-list\"\n [hostComponent]=\"this\"\n [selectionManager]=\"selectionManager\"\n />\n <vdr-dt2-search\n [searchTermControl]=\"searchTermControl\"\n [searchTermPlaceholder]=\"'settings.search-by-product-name-or-sku' | translate\"\n />\n <vdr-dt2-column [heading]=\"'common.id' | translate\" id=\"id\" [hiddenByDefault]=\"true\" [sort]=\"sorts.get('id')\">\n <ng-template let-variant=\"item\">\n {{ variant.id }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column\n [heading]=\"'common.created-at' | translate\" id=\"created-at\"\n [hiddenByDefault]=\"true\"\n [sort]=\"sorts.get('createdAt')\"\n >\n <ng-template let-variant=\"item\">\n {{ variant.createdAt | localeDate : 'short' }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column\n [heading]=\"'common.updated-at' | translate\" id=\"updated-at\"\n [hiddenByDefault]=\"true\"\n [sort]=\"sorts.get('updatedAt')\"\n >\n <ng-template let-variant=\"item\">\n {{ variant.updatedAt | localeDate : 'short' }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.image' | translate\" id=\"image\">\n <ng-template let-variant=\"item\">\n <div class=\"image-placeholder\">\n <img\n *ngIf=\"variant.featuredAsset as asset; else imagePlaceholder\"\n [src]=\"asset | assetPreview : 'tiny'\"\n />\n <ng-template #imagePlaceholder>\n <div class=\"placeholder\">\n <clr-icon shape=\"image\" size=\"48\"></clr-icon>\n </div>\n </ng-template>\n </div>\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'catalog.name' | translate\" id=\"name\" [optional]=\"false\" [sort]=\"sorts.get('name')\">\n <ng-template let-variant=\"item\">\n <a\n class=\"button-ghost\"\n [routerLink]=\"['/catalog/products', variant.productId, 'variants', variant.id]\"\n ><span>{{ variant.name }}</span\n >\n <clr-icon shape=\"arrow right\"\n />\n </a>\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'catalog.sku' | translate\" id=\"sku\" [sort]=\"sorts.get('sku')\">\n <ng-template let-variant=\"item\">\n {{ variant.sku }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.enabled' | translate\" id=\"enabled\">\n <ng-template let-variant=\"item\">\n <vdr-chip *ngIf=\"variant.enabled\" colorType=\"success\">{{\n 'common.enabled' | translate\n }}\n </vdr-chip>\n <vdr-chip *ngIf=\"!variant.enabled\" colorType=\"warning\">{{\n 'common.disabled' | translate\n }}\n </vdr-chip>\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column\n [heading]=\"'common.price' | translate\" id=\"price\"\n [hiddenByDefault]=\"true\"\n [sort]=\"sorts.get('price')\"\n >\n <ng-template let-variant=\"item\">\n {{ variant.price | localeCurrency : variant.currencyCode }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.price-with-tax' | translate\" id=\"price-with-tax\"\n [sort]=\"sorts.get('priceWithTax')\">\n <ng-template let-variant=\"item\">\n {{ variant.priceWithTax | localeCurrency : variant.currencyCode }}\n </ng-template>\n </vdr-dt2-column>\n\n <vdr-dt2-column [heading]=\"'catalog.stock-on-hand' | translate\" id=\"stock-on-hand\" [hiddenByDefault]=\"false\">\n <ng-template let-variant=\"item\">\n <vdr-chip *ngFor=\"let stockLevel of variant.stockLevels\" [title]=\"stockLevel.stockLocation?.name\">\n <div class=\"flex center\">\n <div>\n {{\n stockLevel.stockOnHand\n }}<span class=\"ml-1\" *ngIf=\"stockLevel.stockAllocated\"\n >({{ stockLevel.stockAllocated }} allocated)</span\n >\n </div>\n </div>\n </vdr-chip>\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-custom-field-column *ngFor=\"let field of customFields\" [customField]=\"field\" [sorts]=\"sorts\" />\n</vdr-data-table-2>\n", styles: [".image-col{width:70px}.image-placeholder{width:50px;height:50px;margin-top:calc(var(--space-unit) * -1);margin-bottom:calc(var(--space-unit) * -1);background-color:var(--color-component-bg-200)}.image-placeholder img{border-radius:var(--border-radius-img)}.image-placeholder .placeholder{text-align:center;color:var(--color-grey-300)}.search-form{display:flex;align-items:center;width:100%}vdr-product-search-input{min-width:300px}@media screen and (max-width: 768px){vdr-product-search-input{min-width:100px}}.search-settings-menu{margin:0 12px}td.disabled{background-color:var(--color-component-bg-200)}.search-index-button{position:relative}.search-index-button vdr-status-badge{right:0;top:0}.run-updates-button{position:relative}.run-updates-button vdr-status-badge{left:10px;top:10px}.edit-button{margin-inline-end:24px}.sku{color:var(--color-text-300)}\n"], dependencies: [{ kind: "directive", type: i3.ClrIconCustomTag, selector: "clr-icon" }, { kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i1.ActionBarComponent, selector: "vdr-action-bar" }, { kind: "component", type: i1.ActionBarLeftComponent, selector: "vdr-ab-left", inputs: ["grow"] }, { kind: "component", type: i1.ActionBarRightComponent, selector: "vdr-ab-right", inputs: ["grow"] }, { kind: "component", type: i1.ActionBarDropdownMenuComponent, selector: "vdr-action-bar-dropdown-menu", inputs: ["alwaysShow"] }, { kind: "component", type: i1.ChipComponent, selector: "vdr-chip", inputs: ["icon", "invert", "colorFrom", "colorType"], outputs: ["iconClick"] }, { kind: "component", type: i1.LanguageSelectorComponent, selector: "vdr-language-selector", inputs: ["currentLanguageCode", "availableLanguageCodes", "disabled"], outputs: ["languageCodeChange"] }, { kind: "component", type: i1.ActionBarItemsComponent, selector: "vdr-action-bar-items" }, { kind: "component", type: i1.BulkActionMenuComponent, selector: "vdr-bulk-action-menu", inputs: ["locationId", "selectionManager", "hostComponent"] }, { kind: "component", type: i1.DataTable2Component, selector: "vdr-data-table-2", inputs: ["id", "items", "itemsPerPage", "currentPage", "totalItems", "emptyStateLabel", "filters", "activeIndex", "trackByPath"], outputs: ["pageChange", "itemsPerPageChange", "visibleColumnsChange"] }, { kind: "component", type: i1.DataTable2ColumnComponent, selector: "vdr-dt2-column", inputs: ["id", "expand", "heading", "align", "sort", "optional", "hiddenByDefault", "orderable"], exportAs: ["row"] }, { kind: "component", type: i1.DataTable2SearchComponent, selector: "vdr-dt2-search", inputs: ["searchTermControl", "searchTermPlaceholder"] }, { kind: "component", type: i1.DataTableCustomFieldColumnComponent, selector: "vdr-dt2-custom-field-column", inputs: ["customField", "sorts"], exportAs: ["row"] }, { kind: "component", type: i1.PageBlockComponent, selector: "vdr-page-block" }, { kind: "pipe", type: i3$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }, { kind: "pipe", type: i1.AssetPreviewPipe, name: "assetPreview" }, { kind: "pipe", type: i1.LocaleDatePipe, name: "localeDate" }, { kind: "pipe", type: i1.LocaleCurrencyPipe, name: "localeCurrency" }] }); }
|
|
3470
3470
|
}
|
|
3471
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
3471
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ProductVariantListComponent, decorators: [{
|
|
3472
3472
|
type: Component,
|
|
3473
3473
|
args: [{ selector: 'vdr-product-variant-list', standalone: false, template: "<vdr-page-block>\n <vdr-action-bar>\n <vdr-ab-left>\n <vdr-language-selector *ngIf=\"!hideLanguageSelect\"\n [availableLanguageCodes]=\"availableLanguages$ | async\"\n [currentLanguageCode]=\"contentLanguage$ | async\"\n (languageCodeChange)=\"setLanguage($event)\"\n ></vdr-language-selector>\n </vdr-ab-left>\n <vdr-ab-right>\n <vdr-action-bar-items [locationId]=\"pageLocationId\" />\n <vdr-action-bar-dropdown-menu [locationId]=\"pageLocationId\" />\n </vdr-ab-right>\n </vdr-action-bar>\n</vdr-page-block>\n<vdr-data-table-2\n class=\"mt-2\"\n [id]=\"dataTableId || 'product-variant-list'\"\n [items]=\"items$ | async\"\n [itemsPerPage]=\"itemsPerPage$ | async\"\n [totalItems]=\"totalItems$ | async\"\n [currentPage]=\"currentPage$ | async\"\n [filters]=\"filters\"\n (pageChange)=\"setPageNumber($event)\"\n (itemsPerPageChange)=\"setItemsPerPage($event)\"\n>\n <vdr-bulk-action-menu\n locationId=\"product-variant-list\"\n [hostComponent]=\"this\"\n [selectionManager]=\"selectionManager\"\n />\n <vdr-dt2-search\n [searchTermControl]=\"searchTermControl\"\n [searchTermPlaceholder]=\"'settings.search-by-product-name-or-sku' | translate\"\n />\n <vdr-dt2-column [heading]=\"'common.id' | translate\" id=\"id\" [hiddenByDefault]=\"true\" [sort]=\"sorts.get('id')\">\n <ng-template let-variant=\"item\">\n {{ variant.id }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column\n [heading]=\"'common.created-at' | translate\" id=\"created-at\"\n [hiddenByDefault]=\"true\"\n [sort]=\"sorts.get('createdAt')\"\n >\n <ng-template let-variant=\"item\">\n {{ variant.createdAt | localeDate : 'short' }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column\n [heading]=\"'common.updated-at' | translate\" id=\"updated-at\"\n [hiddenByDefault]=\"true\"\n [sort]=\"sorts.get('updatedAt')\"\n >\n <ng-template let-variant=\"item\">\n {{ variant.updatedAt | localeDate : 'short' }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.image' | translate\" id=\"image\">\n <ng-template let-variant=\"item\">\n <div class=\"image-placeholder\">\n <img\n *ngIf=\"variant.featuredAsset as asset; else imagePlaceholder\"\n [src]=\"asset | assetPreview : 'tiny'\"\n />\n <ng-template #imagePlaceholder>\n <div class=\"placeholder\">\n <clr-icon shape=\"image\" size=\"48\"></clr-icon>\n </div>\n </ng-template>\n </div>\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'catalog.name' | translate\" id=\"name\" [optional]=\"false\" [sort]=\"sorts.get('name')\">\n <ng-template let-variant=\"item\">\n <a\n class=\"button-ghost\"\n [routerLink]=\"['/catalog/products', variant.productId, 'variants', variant.id]\"\n ><span>{{ variant.name }}</span\n >\n <clr-icon shape=\"arrow right\"\n />\n </a>\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'catalog.sku' | translate\" id=\"sku\" [sort]=\"sorts.get('sku')\">\n <ng-template let-variant=\"item\">\n {{ variant.sku }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.enabled' | translate\" id=\"enabled\">\n <ng-template let-variant=\"item\">\n <vdr-chip *ngIf=\"variant.enabled\" colorType=\"success\">{{\n 'common.enabled' | translate\n }}\n </vdr-chip>\n <vdr-chip *ngIf=\"!variant.enabled\" colorType=\"warning\">{{\n 'common.disabled' | translate\n }}\n </vdr-chip>\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column\n [heading]=\"'common.price' | translate\" id=\"price\"\n [hiddenByDefault]=\"true\"\n [sort]=\"sorts.get('price')\"\n >\n <ng-template let-variant=\"item\">\n {{ variant.price | localeCurrency : variant.currencyCode }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.price-with-tax' | translate\" id=\"price-with-tax\"\n [sort]=\"sorts.get('priceWithTax')\">\n <ng-template let-variant=\"item\">\n {{ variant.priceWithTax | localeCurrency : variant.currencyCode }}\n </ng-template>\n </vdr-dt2-column>\n\n <vdr-dt2-column [heading]=\"'catalog.stock-on-hand' | translate\" id=\"stock-on-hand\" [hiddenByDefault]=\"false\">\n <ng-template let-variant=\"item\">\n <vdr-chip *ngFor=\"let stockLevel of variant.stockLevels\" [title]=\"stockLevel.stockLocation?.name\">\n <div class=\"flex center\">\n <div>\n {{\n stockLevel.stockOnHand\n }}<span class=\"ml-1\" *ngIf=\"stockLevel.stockAllocated\"\n >({{ stockLevel.stockAllocated }} allocated)</span\n >\n </div>\n </div>\n </vdr-chip>\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-custom-field-column *ngFor=\"let field of customFields\" [customField]=\"field\" [sorts]=\"sorts\" />\n</vdr-data-table-2>\n", styles: [".image-col{width:70px}.image-placeholder{width:50px;height:50px;margin-top:calc(var(--space-unit) * -1);margin-bottom:calc(var(--space-unit) * -1);background-color:var(--color-component-bg-200)}.image-placeholder img{border-radius:var(--border-radius-img)}.image-placeholder .placeholder{text-align:center;color:var(--color-grey-300)}.search-form{display:flex;align-items:center;width:100%}vdr-product-search-input{min-width:300px}@media screen and (max-width: 768px){vdr-product-search-input{min-width:100px}}.search-settings-menu{margin:0 12px}td.disabled{background-color:var(--color-component-bg-200)}.search-index-button{position:relative}.search-index-button vdr-status-badge{right:0;top:0}.run-updates-button{position:relative}.run-updates-button vdr-status-badge{left:10px;top:10px}.edit-button{margin-inline-end:24px}.sku{color:var(--color-text-300)}\n"] }]
|
|
3474
3474
|
}], ctorParameters: () => [], propDecorators: { productId: [{
|
|
@@ -3767,10 +3767,10 @@ class ProductDetailComponent extends TypedBaseDetailComponent {
|
|
|
3767
3767
|
slugControl.setValue(firstResult.updateProduct.slug, { emitEvent: false });
|
|
3768
3768
|
}
|
|
3769
3769
|
}
|
|
3770
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
3771
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: ProductDetailComponent, isStandalone: false, selector: "vdr-product-detail2", usesInheritance: true, ngImport: i0, template: "<vdr-page-block>\n <vdr-action-bar>\n <vdr-ab-left>\n <div class=\"flex clr-flex-row\"></div>\n <vdr-language-selector\n [disabled]=\"isNew$ | async\"\n [availableLanguageCodes]=\"availableLanguages$ | async\"\n [currentLanguageCode]=\"languageCode$ | async\"\n (languageCodeChange)=\"setLanguage($event)\"\n ></vdr-language-selector>\n </vdr-ab-left>\n\n <vdr-ab-right>\n <vdr-action-bar-items locationId=\"product-detail\"></vdr-action-bar-items>\n <button\n class=\"btn btn-primary\"\n *ngIf=\"isNew$ | async; else updateButton\"\n (click)=\"create()\"\n [disabled]=\"detailForm.invalid || detailForm.pristine || createVariantsConfig.variants.length === 0\"\n >\n {{ 'common.create' | translate }}\n </button>\n <ng-template #updateButton>\n <button\n *vdrIfPermissions=\"updatePermissions\"\n class=\"btn btn-primary\"\n (click)=\"save()\"\n [disabled]=\"(detailForm.invalid || detailForm.pristine) && !assetsChanged()\"\n >\n {{ 'common.update' | translate }}\n </button>\n </ng-template>\n <vdr-action-bar-dropdown-menu locationId=\"product-detail\"></vdr-action-bar-dropdown-menu>\n </vdr-ab-right>\n </vdr-action-bar>\n</vdr-page-block>\n\n<form class=\"form\" [formGroup]=\"detailForm\">\n <vdr-page-detail-layout>\n <vdr-page-detail-sidebar>\n <vdr-card>\n <vdr-form-field [label]=\"'catalog.visibility' | translate\" for=\"visibility\">\n <clr-toggle-wrapper *vdrIfPermissions=\"updatePermissions\">\n <input\n type=\"checkbox\"\n clrToggle\n name=\"enabled\"\n [formControl]=\"detailForm.get(['enabled'])\"\n />\n <label>{{ 'common.enabled' | translate }}</label>\n </clr-toggle-wrapper>\n </vdr-form-field>\n </vdr-card>\n <ng-container *ngIf=\"!(isNew$ | async)\">\n <vdr-card *vdrIfMultichannel [title]=\"'common.channels' | translate\">\n <vdr-form-item *vdrIfDefaultChannelActive>\n <div class=\"flex channel-assignment\">\n <div class=\"mb-2\">\n <ng-container *ngFor=\"let channel of productChannels$ | async\">\n <vdr-chip\n *ngIf=\"!isDefaultChannel(channel.code)\"\n icon=\"times-circle\"\n (iconClick)=\"removeFromChannel(channel.id)\"\n >\n <vdr-channel-badge [channelCode]=\"channel.code\"></vdr-channel-badge>\n {{ channel.code | channelCodeToLabel }}\n </vdr-chip>\n </ng-container>\n </div>\n <button class=\"button-small\" (click)=\"assignToChannel()\">\n <clr-icon shape=\"layers\"></clr-icon>\n {{ 'common.assign-to-channel' | translate }}\n </button>\n </div>\n </vdr-form-item>\n </vdr-card>\n </ng-container>\n <vdr-card *ngIf=\"entity?.optionGroups.length\" [title]=\"'catalog.product-options' | translate\">\n <div class=\"options\">\n <vdr-chip\n *ngFor=\"let optionGroup of entity?.optionGroups | sort : 'id'\"\n [colorFrom]=\"optionGroup.code\"\n [invert]=\"true\"\n >\n {{ optionGroup.name }}\n </vdr-chip>\n </div>\n <div>\n <a [routerLink]=\"['options']\" class=\"button-small mt-2\" *vdrIfPermissions=\"updatePermissions\">\n <clr-icon shape=\"pencil\"></clr-icon>\n {{ 'catalog.edit-options' | translate }}\n </a>\n </div>\n </vdr-card>\n <vdr-card [title]=\"'catalog.facets' | translate\">\n <div class=\"facets\">\n <vdr-facet-value-chip\n *ngFor=\"let facetValue of facetValues$ | async\"\n [facetValue]=\"facetValue\"\n [removable]=\"updatePermissions | hasPermission\"\n (remove)=\"removeProductFacetValue(facetValue.id)\"\n ></vdr-facet-value-chip>\n </div>\n <div>\n <button\n class=\"button-small mt-2\"\n *vdrIfPermissions=\"updatePermissions\"\n (click)=\"selectProductFacetValue()\"\n >\n <clr-icon shape=\"plus\"></clr-icon>\n {{ 'catalog.add-facets' | translate }}\n </button>\n </div>\n </vdr-card>\n <vdr-card *ngIf=\"entity$ | async as entity\">\n <vdr-page-entity-info [entity]=\"entity\"></vdr-page-entity-info>\n </vdr-card>\n </vdr-page-detail-sidebar>\n\n <vdr-page-block>\n <button type=\"submit\" hidden x-data=\"prevents enter key from triggering other buttons\"></button>\n <vdr-card>\n <div class=\"form-grid\">\n <div>\n <vdr-form-field [label]=\"'catalog.product-name' | translate\" for=\"name\">\n <input\n id=\"name\"\n type=\"text\"\n formControlName=\"name\"\n [readonly]=\"!(updatePermissions | hasPermission)\"\n (input)=\"updateSlug($event.target.value)\"\n />\n </vdr-form-field>\n <div *ngIf=\"(isNew$ | async) === false && detailForm.get(['name'])?.dirty\">\n <clr-checkbox-wrapper>\n <input\n clrCheckbox\n type=\"checkbox\"\n id=\"auto-update\"\n formControlName=\"autoUpdateVariantNames\"\n />\n <label>{{ 'catalog.auto-update-product-variant-name' | translate }}</label>\n </clr-checkbox-wrapper>\n </div>\n </div>\n <vdr-form-field\n [label]=\"'catalog.slug' | translate\"\n for=\"slug\"\n [errors]=\"{ pattern: 'catalog.slug-pattern-error' | translate }\"\n >\n <input\n id=\"slug\"\n type=\"text\"\n formControlName=\"slug\"\n [readonly]=\"!(updatePermissions | hasPermission)\"\n />\n </vdr-form-field>\n <vdr-form-field\n class=\"form-grid-span\"\n [label]=\"'common.description' | translate\"\n for=\"slug\"\n [errors]=\"{ pattern: 'catalog.slug-pattern-error' | translate }\"\n >\n <vdr-rich-text-editor\n formControlName=\"description\"\n [readonly]=\"!(updatePermissions | hasPermission)\"\n ></vdr-rich-text-editor>\n </vdr-form-field>\n </div>\n </vdr-card>\n <vdr-card [title]=\"'common.custom-fields' | translate\" *ngIf=\"customFields.length\">\n <vdr-tabbed-custom-fields\n entityName=\"Product\"\n [customFields]=\"customFields\"\n [customFieldsFormGroup]=\"detailForm.get('customFields')\"\n [readonly]=\"!(updatePermissions | hasPermission)\"\n ></vdr-tabbed-custom-fields>\n </vdr-card>\n <vdr-custom-detail-component-host\n locationId=\"product-detail\"\n [entity$]=\"entity$\"\n [detailForm]=\"detailForm\"\n ></vdr-custom-detail-component-host>\n <vdr-card [title]=\"'catalog.assets' | translate\">\n <vdr-assets\n [assets]=\"assetChanges.assets || entity?.assets\"\n [featuredAsset]=\"assetChanges.featuredAsset || entity?.featuredAsset\"\n [updatePermissions]=\"updatePermissions\"\n (change)=\"assetChanges = $event\"\n ></vdr-assets>\n </vdr-card>\n\n <vdr-card [title]=\"'catalog.product-variants' | translate\" [paddingX]=\"isNew$ | async\">\n <div *ngIf=\"isNew$ | async; else variantList\">\n <vdr-generate-product-variants\n (variantsChange)=\"createVariantsConfig = $event\"\n ></vdr-generate-product-variants>\n </div>\n <ng-template #variantList>\n <vdr-product-variant-list\n [productId]=\"this.id\"\n dataTableId=\"product-detail-variants-list\"\n [hideLanguageSelect]=\"true\"\n ></vdr-product-variant-list>\n </ng-template>\n <div class=\"mx-3\" *ngIf=\"(isNew$ | async) === false\">\n <a class=\"button\" [routerLink]=\"['manage-variants']\">\n <clr-icon shape=\"add-text\"></clr-icon>\n {{ 'catalog.manage-variants' | translate }}</a\n >\n </div>\n </vdr-card>\n </vdr-page-block>\n </vdr-page-detail-layout>\n</form>\n", styles: [":host ::ng-deep trix-toolbar{top:24px}.facets,.options{display:flex;flex-wrap:wrap;gap:3px}vdr-action-bar clr-toggle-wrapper{margin-top:12px}.variant-filter{flex:1;display:flex}.variant-filter input{flex:1;max-width:initial;border-radius:3px 0 0 3px!important}.variant-filter .icon-button{border:1px solid var(--color-component-border-300);background-color:var(--color-component-bg-100);border-radius:0 3px 3px 0;border-inline-start:none}.group-name{padding-inline-end:6px}.view-mode{display:flex;flex-direction:column;justify-content:space-between}@media screen and (min-width: 768px){.view-mode{flex-direction:row}}.edit-variants-btn{margin-top:0}.channel-assignment{flex-wrap:wrap;min-height:24px}.pagination-row{display:flex;align-items:baseline;justify-content:space-between}\n"], dependencies: [{ kind: "directive", type: i3.ClrIconCustomTag, selector: "clr-icon" }, { kind: "directive", type: i3.ClrLabel, selector: "label", inputs: ["id", "for"] }, { kind: "directive", type: i3.ClrCheckbox, selector: "[clrCheckbox],[clrToggle]" }, { kind: "component", type: i3.ClrCheckboxWrapper, selector: "clr-checkbox-wrapper,clr-toggle-wrapper" }, { kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i1.ActionBarComponent, selector: "vdr-action-bar" }, { kind: "component", type: i1.ActionBarLeftComponent, selector: "vdr-ab-left", inputs: ["grow"] }, { kind: "component", type: i1.ActionBarRightComponent, selector: "vdr-ab-right", inputs: ["grow"] }, { kind: "component", type: i1.ActionBarDropdownMenuComponent, selector: "vdr-action-bar-dropdown-menu", inputs: ["alwaysShow"] }, { kind: "component", type: i1.AssetsComponent, selector: "vdr-assets", inputs: ["assets", "featuredAsset", "compact", "updatePermissions", "multiSelect"], outputs: ["change"] }, { kind: "component", type: i1.ChipComponent, selector: "vdr-chip", inputs: ["icon", "invert", "colorFrom", "colorType"], outputs: ["iconClick"] }, { kind: "component", type: i1.FacetValueChipComponent, selector: "vdr-facet-value-chip", inputs: ["facetValue", "removable", "displayFacetName"], outputs: ["remove"] }, { kind: "component", type: i1.FormFieldComponent, selector: "vdr-form-field", inputs: ["label", "for", "tooltip", "errors", "readOnlyToggle"], outputs: ["readOnlyToggleChange"] }, { kind: "directive", type: i1.FormFieldControlDirective, selector: "input, textarea, select, vdr-currency-input" }, { kind: "component", type: i1.FormItemComponent, selector: "vdr-form-item", inputs: ["label", "tooltip"] }, { kind: "component", type: i1.LanguageSelectorComponent, selector: "vdr-language-selector", inputs: ["currentLanguageCode", "availableLanguageCodes", "disabled"], outputs: ["languageCodeChange"] }, { kind: "component", type: i1.RichTextEditorComponent, selector: "vdr-rich-text-editor", inputs: ["label", "readonly"] }, { kind: "directive", type: i1.IfPermissionsDirective, selector: "[vdrIfPermissions]", inputs: ["vdrIfPermissions", "vdrIfPermissionsElse"] }, { kind: "directive", type: i1.IfMultichannelDirective, selector: "[vdrIfMultichannel]", inputs: ["vdrIfMultichannelElse"] }, { kind: "component", type: i1.ActionBarItemsComponent, selector: "vdr-action-bar-items" }, { kind: "component", type: i1.ChannelBadgeComponent, selector: "vdr-channel-badge", inputs: ["channelCode"] }, { kind: "directive", type: i1.IfDefaultChannelActiveDirective, selector: "[vdrIfDefaultChannelActive]", inputs: ["vdrIfMultichannelElse"] }, { kind: "component", type: i1.TabbedCustomFieldsComponent, selector: "vdr-tabbed-custom-fields", inputs: ["entityName", "customFields", "customFieldsFormGroup", "readonly", "compact", "showLabel"] }, { kind: "component", type: i1.CustomDetailComponentHostComponent, selector: "vdr-custom-detail-component-host", inputs: ["locationId", "entity$", "detailForm"] }, { kind: "component", type: i1.PageBlockComponent, selector: "vdr-page-block" }, { kind: "component", type: i1.PageEntityInfoComponent, selector: "vdr-page-entity-info", inputs: ["entity"] }, { kind: "component", type: i1.PageDetailLayoutComponent, selector: "vdr-page-detail-layout" }, { kind: "component", type: i1.PageDetailSidebarComponent, selector: "vdr-page-detail-sidebar" }, { kind: "component", type: i1.CardComponent, selector: "vdr-card", inputs: ["title", "paddingX"] }, { kind: "component", type: GenerateProductVariantsComponent, selector: "vdr-generate-product-variants", outputs: ["variantsChange"] }, { kind: "component", type: ProductVariantListComponent, selector: "vdr-product-variant-list", inputs: ["productId", "hideLanguageSelect", "dataTableId"] }, { kind: "pipe", type: i3$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }, { kind: "pipe", type: i1.SortPipe, name: "sort" }, { kind: "pipe", type: i1.HasPermissionPipe, name: "hasPermission" }, { kind: "pipe", type: i1.ChannelLabelPipe, name: "channelCodeToLabel" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
3770
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ProductDetailComponent, deps: [{ token: ProductDetailService }, { token: i2.FormBuilder }, { token: i1.ModalService }, { token: i1.NotificationService }, { token: i1.DataService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3771
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: ProductDetailComponent, isStandalone: false, selector: "vdr-product-detail2", usesInheritance: true, ngImport: i0, template: "<vdr-page-block>\n <vdr-action-bar>\n <vdr-ab-left>\n <div class=\"flex clr-flex-row\"></div>\n <vdr-language-selector\n [disabled]=\"isNew$ | async\"\n [availableLanguageCodes]=\"availableLanguages$ | async\"\n [currentLanguageCode]=\"languageCode$ | async\"\n (languageCodeChange)=\"setLanguage($event)\"\n ></vdr-language-selector>\n </vdr-ab-left>\n\n <vdr-ab-right>\n <vdr-action-bar-items locationId=\"product-detail\"></vdr-action-bar-items>\n <button\n class=\"btn btn-primary\"\n *ngIf=\"isNew$ | async; else updateButton\"\n (click)=\"create()\"\n [disabled]=\"detailForm.invalid || detailForm.pristine || createVariantsConfig.variants.length === 0\"\n >\n {{ 'common.create' | translate }}\n </button>\n <ng-template #updateButton>\n <button\n *vdrIfPermissions=\"updatePermissions\"\n class=\"btn btn-primary\"\n (click)=\"save()\"\n [disabled]=\"(detailForm.invalid || detailForm.pristine) && !assetsChanged()\"\n >\n {{ 'common.update' | translate }}\n </button>\n </ng-template>\n <vdr-action-bar-dropdown-menu locationId=\"product-detail\"></vdr-action-bar-dropdown-menu>\n </vdr-ab-right>\n </vdr-action-bar>\n</vdr-page-block>\n\n<form class=\"form\" [formGroup]=\"detailForm\">\n <vdr-page-detail-layout>\n <vdr-page-detail-sidebar>\n <vdr-card>\n <vdr-form-field [label]=\"'catalog.visibility' | translate\" for=\"visibility\">\n <clr-toggle-wrapper *vdrIfPermissions=\"updatePermissions\">\n <input\n type=\"checkbox\"\n clrToggle\n name=\"enabled\"\n [formControl]=\"detailForm.get(['enabled'])\"\n />\n <label>{{ 'common.enabled' | translate }}</label>\n </clr-toggle-wrapper>\n </vdr-form-field>\n </vdr-card>\n <ng-container *ngIf=\"!(isNew$ | async)\">\n <vdr-card *vdrIfMultichannel [title]=\"'common.channels' | translate\">\n <vdr-form-item *vdrIfDefaultChannelActive>\n <div class=\"flex channel-assignment\">\n <div class=\"mb-2\">\n <ng-container *ngFor=\"let channel of productChannels$ | async\">\n <vdr-chip\n *ngIf=\"!isDefaultChannel(channel.code)\"\n icon=\"times-circle\"\n (iconClick)=\"removeFromChannel(channel.id)\"\n >\n <vdr-channel-badge [channelCode]=\"channel.code\"></vdr-channel-badge>\n {{ channel.code | channelCodeToLabel }}\n </vdr-chip>\n </ng-container>\n </div>\n <button class=\"button-small\" (click)=\"assignToChannel()\">\n <clr-icon shape=\"layers\"></clr-icon>\n {{ 'common.assign-to-channel' | translate }}\n </button>\n </div>\n </vdr-form-item>\n </vdr-card>\n </ng-container>\n <vdr-card *ngIf=\"entity?.optionGroups.length\" [title]=\"'catalog.product-options' | translate\">\n <div class=\"options\">\n <vdr-chip\n *ngFor=\"let optionGroup of entity?.optionGroups | sort : 'id'\"\n [colorFrom]=\"optionGroup.code\"\n [invert]=\"true\"\n >\n {{ optionGroup.name }}\n </vdr-chip>\n </div>\n <div>\n <a [routerLink]=\"['options']\" class=\"button-small mt-2\" *vdrIfPermissions=\"updatePermissions\">\n <clr-icon shape=\"pencil\"></clr-icon>\n {{ 'catalog.edit-options' | translate }}\n </a>\n </div>\n </vdr-card>\n <vdr-card [title]=\"'catalog.facets' | translate\">\n <div class=\"facets\">\n <vdr-facet-value-chip\n *ngFor=\"let facetValue of facetValues$ | async\"\n [facetValue]=\"facetValue\"\n [removable]=\"updatePermissions | hasPermission\"\n (remove)=\"removeProductFacetValue(facetValue.id)\"\n ></vdr-facet-value-chip>\n </div>\n <div>\n <button\n class=\"button-small mt-2\"\n *vdrIfPermissions=\"updatePermissions\"\n (click)=\"selectProductFacetValue()\"\n >\n <clr-icon shape=\"plus\"></clr-icon>\n {{ 'catalog.add-facets' | translate }}\n </button>\n </div>\n </vdr-card>\n <vdr-card *ngIf=\"entity$ | async as entity\">\n <vdr-page-entity-info [entity]=\"entity\"></vdr-page-entity-info>\n </vdr-card>\n </vdr-page-detail-sidebar>\n\n <vdr-page-block>\n <button type=\"submit\" hidden x-data=\"prevents enter key from triggering other buttons\"></button>\n <vdr-card>\n <div class=\"form-grid\">\n <div>\n <vdr-form-field [label]=\"'catalog.product-name' | translate\" for=\"name\">\n <input\n id=\"name\"\n type=\"text\"\n formControlName=\"name\"\n [readonly]=\"!(updatePermissions | hasPermission)\"\n (input)=\"updateSlug($event.target.value)\"\n />\n </vdr-form-field>\n <div *ngIf=\"(isNew$ | async) === false && detailForm.get(['name'])?.dirty\">\n <clr-checkbox-wrapper>\n <input\n clrCheckbox\n type=\"checkbox\"\n id=\"auto-update\"\n formControlName=\"autoUpdateVariantNames\"\n />\n <label>{{ 'catalog.auto-update-product-variant-name' | translate }}</label>\n </clr-checkbox-wrapper>\n </div>\n </div>\n <vdr-form-field\n [label]=\"'catalog.slug' | translate\"\n for=\"slug\"\n [errors]=\"{ pattern: 'catalog.slug-pattern-error' | translate }\"\n >\n <input\n id=\"slug\"\n type=\"text\"\n formControlName=\"slug\"\n [readonly]=\"!(updatePermissions | hasPermission)\"\n />\n </vdr-form-field>\n <vdr-form-field\n class=\"form-grid-span\"\n [label]=\"'common.description' | translate\"\n for=\"slug\"\n [errors]=\"{ pattern: 'catalog.slug-pattern-error' | translate }\"\n >\n <vdr-rich-text-editor\n formControlName=\"description\"\n [readonly]=\"!(updatePermissions | hasPermission)\"\n ></vdr-rich-text-editor>\n </vdr-form-field>\n </div>\n </vdr-card>\n <vdr-card [title]=\"'common.custom-fields' | translate\" *ngIf=\"customFields.length\">\n <vdr-tabbed-custom-fields\n entityName=\"Product\"\n [customFields]=\"customFields\"\n [customFieldsFormGroup]=\"detailForm.get('customFields')\"\n [readonly]=\"!(updatePermissions | hasPermission)\"\n ></vdr-tabbed-custom-fields>\n </vdr-card>\n <vdr-custom-detail-component-host\n locationId=\"product-detail\"\n [entity$]=\"entity$\"\n [detailForm]=\"detailForm\"\n ></vdr-custom-detail-component-host>\n <vdr-card [title]=\"'catalog.assets' | translate\">\n <vdr-assets\n [assets]=\"assetChanges.assets || entity?.assets\"\n [featuredAsset]=\"assetChanges.featuredAsset || entity?.featuredAsset\"\n [updatePermissions]=\"updatePermissions\"\n (change)=\"assetChanges = $event\"\n ></vdr-assets>\n </vdr-card>\n\n <vdr-card [title]=\"'catalog.product-variants' | translate\" [paddingX]=\"isNew$ | async\">\n <div *ngIf=\"isNew$ | async; else variantList\">\n <vdr-generate-product-variants\n (variantsChange)=\"createVariantsConfig = $event\"\n ></vdr-generate-product-variants>\n </div>\n <ng-template #variantList>\n <vdr-product-variant-list\n [productId]=\"this.id\"\n dataTableId=\"product-detail-variants-list\"\n [hideLanguageSelect]=\"true\"\n ></vdr-product-variant-list>\n </ng-template>\n <div class=\"mx-3\" *ngIf=\"(isNew$ | async) === false\">\n <a class=\"button\" [routerLink]=\"['manage-variants']\">\n <clr-icon shape=\"add-text\"></clr-icon>\n {{ 'catalog.manage-variants' | translate }}</a\n >\n </div>\n </vdr-card>\n </vdr-page-block>\n </vdr-page-detail-layout>\n</form>\n", styles: [":host ::ng-deep trix-toolbar{top:24px}.facets,.options{display:flex;flex-wrap:wrap;gap:3px}vdr-action-bar clr-toggle-wrapper{margin-top:12px}.variant-filter{flex:1;display:flex}.variant-filter input{flex:1;max-width:initial;border-radius:3px 0 0 3px!important}.variant-filter .icon-button{border:1px solid var(--color-component-border-300);background-color:var(--color-component-bg-100);border-radius:0 3px 3px 0;border-inline-start:none}.group-name{padding-inline-end:6px}.view-mode{display:flex;flex-direction:column;justify-content:space-between}@media screen and (min-width: 768px){.view-mode{flex-direction:row}}.edit-variants-btn{margin-top:0}.channel-assignment{flex-wrap:wrap;min-height:24px}.pagination-row{display:flex;align-items:baseline;justify-content:space-between}\n"], dependencies: [{ kind: "directive", type: i3.ClrIconCustomTag, selector: "clr-icon" }, { kind: "directive", type: i3.ClrLabel, selector: "label", inputs: ["id", "for"] }, { kind: "directive", type: i3.ClrCheckbox, selector: "[clrCheckbox],[clrToggle]" }, { kind: "component", type: i3.ClrCheckboxWrapper, selector: "clr-checkbox-wrapper,clr-toggle-wrapper" }, { kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i1.ActionBarComponent, selector: "vdr-action-bar" }, { kind: "component", type: i1.ActionBarLeftComponent, selector: "vdr-ab-left", inputs: ["grow"] }, { kind: "component", type: i1.ActionBarRightComponent, selector: "vdr-ab-right", inputs: ["grow"] }, { kind: "component", type: i1.ActionBarDropdownMenuComponent, selector: "vdr-action-bar-dropdown-menu", inputs: ["alwaysShow"] }, { kind: "component", type: i1.AssetsComponent, selector: "vdr-assets", inputs: ["assets", "featuredAsset", "compact", "updatePermissions", "multiSelect"], outputs: ["change"] }, { kind: "component", type: i1.ChipComponent, selector: "vdr-chip", inputs: ["icon", "invert", "colorFrom", "colorType"], outputs: ["iconClick"] }, { kind: "component", type: i1.FacetValueChipComponent, selector: "vdr-facet-value-chip", inputs: ["facetValue", "removable", "displayFacetName"], outputs: ["remove"] }, { kind: "component", type: i1.FormFieldComponent, selector: "vdr-form-field", inputs: ["label", "for", "tooltip", "errors", "readOnlyToggle"], outputs: ["readOnlyToggleChange"] }, { kind: "directive", type: i1.FormFieldControlDirective, selector: "input, textarea, select, vdr-currency-input" }, { kind: "component", type: i1.FormItemComponent, selector: "vdr-form-item", inputs: ["label", "tooltip"] }, { kind: "component", type: i1.LanguageSelectorComponent, selector: "vdr-language-selector", inputs: ["currentLanguageCode", "availableLanguageCodes", "disabled"], outputs: ["languageCodeChange"] }, { kind: "component", type: i1.RichTextEditorComponent, selector: "vdr-rich-text-editor", inputs: ["label", "readonly"] }, { kind: "directive", type: i1.IfPermissionsDirective, selector: "[vdrIfPermissions]", inputs: ["vdrIfPermissions", "vdrIfPermissionsElse"] }, { kind: "directive", type: i1.IfMultichannelDirective, selector: "[vdrIfMultichannel]", inputs: ["vdrIfMultichannelElse"] }, { kind: "component", type: i1.ActionBarItemsComponent, selector: "vdr-action-bar-items" }, { kind: "component", type: i1.ChannelBadgeComponent, selector: "vdr-channel-badge", inputs: ["channelCode"] }, { kind: "directive", type: i1.IfDefaultChannelActiveDirective, selector: "[vdrIfDefaultChannelActive]", inputs: ["vdrIfMultichannelElse"] }, { kind: "component", type: i1.TabbedCustomFieldsComponent, selector: "vdr-tabbed-custom-fields", inputs: ["entityName", "customFields", "customFieldsFormGroup", "readonly", "compact", "showLabel"] }, { kind: "component", type: i1.CustomDetailComponentHostComponent, selector: "vdr-custom-detail-component-host", inputs: ["locationId", "entity$", "detailForm"] }, { kind: "component", type: i1.PageBlockComponent, selector: "vdr-page-block" }, { kind: "component", type: i1.PageEntityInfoComponent, selector: "vdr-page-entity-info", inputs: ["entity"] }, { kind: "component", type: i1.PageDetailLayoutComponent, selector: "vdr-page-detail-layout" }, { kind: "component", type: i1.PageDetailSidebarComponent, selector: "vdr-page-detail-sidebar" }, { kind: "component", type: i1.CardComponent, selector: "vdr-card", inputs: ["title", "paddingX"] }, { kind: "component", type: GenerateProductVariantsComponent, selector: "vdr-generate-product-variants", outputs: ["variantsChange"] }, { kind: "component", type: ProductVariantListComponent, selector: "vdr-product-variant-list", inputs: ["productId", "hideLanguageSelect", "dataTableId"] }, { kind: "pipe", type: i3$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }, { kind: "pipe", type: i1.SortPipe, name: "sort" }, { kind: "pipe", type: i1.HasPermissionPipe, name: "hasPermission" }, { kind: "pipe", type: i1.ChannelLabelPipe, name: "channelCodeToLabel" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
3772
3772
|
}
|
|
3773
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
3773
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ProductDetailComponent, decorators: [{
|
|
3774
3774
|
type: Component,
|
|
3775
3775
|
args: [{ selector: 'vdr-product-detail2', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<vdr-page-block>\n <vdr-action-bar>\n <vdr-ab-left>\n <div class=\"flex clr-flex-row\"></div>\n <vdr-language-selector\n [disabled]=\"isNew$ | async\"\n [availableLanguageCodes]=\"availableLanguages$ | async\"\n [currentLanguageCode]=\"languageCode$ | async\"\n (languageCodeChange)=\"setLanguage($event)\"\n ></vdr-language-selector>\n </vdr-ab-left>\n\n <vdr-ab-right>\n <vdr-action-bar-items locationId=\"product-detail\"></vdr-action-bar-items>\n <button\n class=\"btn btn-primary\"\n *ngIf=\"isNew$ | async; else updateButton\"\n (click)=\"create()\"\n [disabled]=\"detailForm.invalid || detailForm.pristine || createVariantsConfig.variants.length === 0\"\n >\n {{ 'common.create' | translate }}\n </button>\n <ng-template #updateButton>\n <button\n *vdrIfPermissions=\"updatePermissions\"\n class=\"btn btn-primary\"\n (click)=\"save()\"\n [disabled]=\"(detailForm.invalid || detailForm.pristine) && !assetsChanged()\"\n >\n {{ 'common.update' | translate }}\n </button>\n </ng-template>\n <vdr-action-bar-dropdown-menu locationId=\"product-detail\"></vdr-action-bar-dropdown-menu>\n </vdr-ab-right>\n </vdr-action-bar>\n</vdr-page-block>\n\n<form class=\"form\" [formGroup]=\"detailForm\">\n <vdr-page-detail-layout>\n <vdr-page-detail-sidebar>\n <vdr-card>\n <vdr-form-field [label]=\"'catalog.visibility' | translate\" for=\"visibility\">\n <clr-toggle-wrapper *vdrIfPermissions=\"updatePermissions\">\n <input\n type=\"checkbox\"\n clrToggle\n name=\"enabled\"\n [formControl]=\"detailForm.get(['enabled'])\"\n />\n <label>{{ 'common.enabled' | translate }}</label>\n </clr-toggle-wrapper>\n </vdr-form-field>\n </vdr-card>\n <ng-container *ngIf=\"!(isNew$ | async)\">\n <vdr-card *vdrIfMultichannel [title]=\"'common.channels' | translate\">\n <vdr-form-item *vdrIfDefaultChannelActive>\n <div class=\"flex channel-assignment\">\n <div class=\"mb-2\">\n <ng-container *ngFor=\"let channel of productChannels$ | async\">\n <vdr-chip\n *ngIf=\"!isDefaultChannel(channel.code)\"\n icon=\"times-circle\"\n (iconClick)=\"removeFromChannel(channel.id)\"\n >\n <vdr-channel-badge [channelCode]=\"channel.code\"></vdr-channel-badge>\n {{ channel.code | channelCodeToLabel }}\n </vdr-chip>\n </ng-container>\n </div>\n <button class=\"button-small\" (click)=\"assignToChannel()\">\n <clr-icon shape=\"layers\"></clr-icon>\n {{ 'common.assign-to-channel' | translate }}\n </button>\n </div>\n </vdr-form-item>\n </vdr-card>\n </ng-container>\n <vdr-card *ngIf=\"entity?.optionGroups.length\" [title]=\"'catalog.product-options' | translate\">\n <div class=\"options\">\n <vdr-chip\n *ngFor=\"let optionGroup of entity?.optionGroups | sort : 'id'\"\n [colorFrom]=\"optionGroup.code\"\n [invert]=\"true\"\n >\n {{ optionGroup.name }}\n </vdr-chip>\n </div>\n <div>\n <a [routerLink]=\"['options']\" class=\"button-small mt-2\" *vdrIfPermissions=\"updatePermissions\">\n <clr-icon shape=\"pencil\"></clr-icon>\n {{ 'catalog.edit-options' | translate }}\n </a>\n </div>\n </vdr-card>\n <vdr-card [title]=\"'catalog.facets' | translate\">\n <div class=\"facets\">\n <vdr-facet-value-chip\n *ngFor=\"let facetValue of facetValues$ | async\"\n [facetValue]=\"facetValue\"\n [removable]=\"updatePermissions | hasPermission\"\n (remove)=\"removeProductFacetValue(facetValue.id)\"\n ></vdr-facet-value-chip>\n </div>\n <div>\n <button\n class=\"button-small mt-2\"\n *vdrIfPermissions=\"updatePermissions\"\n (click)=\"selectProductFacetValue()\"\n >\n <clr-icon shape=\"plus\"></clr-icon>\n {{ 'catalog.add-facets' | translate }}\n </button>\n </div>\n </vdr-card>\n <vdr-card *ngIf=\"entity$ | async as entity\">\n <vdr-page-entity-info [entity]=\"entity\"></vdr-page-entity-info>\n </vdr-card>\n </vdr-page-detail-sidebar>\n\n <vdr-page-block>\n <button type=\"submit\" hidden x-data=\"prevents enter key from triggering other buttons\"></button>\n <vdr-card>\n <div class=\"form-grid\">\n <div>\n <vdr-form-field [label]=\"'catalog.product-name' | translate\" for=\"name\">\n <input\n id=\"name\"\n type=\"text\"\n formControlName=\"name\"\n [readonly]=\"!(updatePermissions | hasPermission)\"\n (input)=\"updateSlug($event.target.value)\"\n />\n </vdr-form-field>\n <div *ngIf=\"(isNew$ | async) === false && detailForm.get(['name'])?.dirty\">\n <clr-checkbox-wrapper>\n <input\n clrCheckbox\n type=\"checkbox\"\n id=\"auto-update\"\n formControlName=\"autoUpdateVariantNames\"\n />\n <label>{{ 'catalog.auto-update-product-variant-name' | translate }}</label>\n </clr-checkbox-wrapper>\n </div>\n </div>\n <vdr-form-field\n [label]=\"'catalog.slug' | translate\"\n for=\"slug\"\n [errors]=\"{ pattern: 'catalog.slug-pattern-error' | translate }\"\n >\n <input\n id=\"slug\"\n type=\"text\"\n formControlName=\"slug\"\n [readonly]=\"!(updatePermissions | hasPermission)\"\n />\n </vdr-form-field>\n <vdr-form-field\n class=\"form-grid-span\"\n [label]=\"'common.description' | translate\"\n for=\"slug\"\n [errors]=\"{ pattern: 'catalog.slug-pattern-error' | translate }\"\n >\n <vdr-rich-text-editor\n formControlName=\"description\"\n [readonly]=\"!(updatePermissions | hasPermission)\"\n ></vdr-rich-text-editor>\n </vdr-form-field>\n </div>\n </vdr-card>\n <vdr-card [title]=\"'common.custom-fields' | translate\" *ngIf=\"customFields.length\">\n <vdr-tabbed-custom-fields\n entityName=\"Product\"\n [customFields]=\"customFields\"\n [customFieldsFormGroup]=\"detailForm.get('customFields')\"\n [readonly]=\"!(updatePermissions | hasPermission)\"\n ></vdr-tabbed-custom-fields>\n </vdr-card>\n <vdr-custom-detail-component-host\n locationId=\"product-detail\"\n [entity$]=\"entity$\"\n [detailForm]=\"detailForm\"\n ></vdr-custom-detail-component-host>\n <vdr-card [title]=\"'catalog.assets' | translate\">\n <vdr-assets\n [assets]=\"assetChanges.assets || entity?.assets\"\n [featuredAsset]=\"assetChanges.featuredAsset || entity?.featuredAsset\"\n [updatePermissions]=\"updatePermissions\"\n (change)=\"assetChanges = $event\"\n ></vdr-assets>\n </vdr-card>\n\n <vdr-card [title]=\"'catalog.product-variants' | translate\" [paddingX]=\"isNew$ | async\">\n <div *ngIf=\"isNew$ | async; else variantList\">\n <vdr-generate-product-variants\n (variantsChange)=\"createVariantsConfig = $event\"\n ></vdr-generate-product-variants>\n </div>\n <ng-template #variantList>\n <vdr-product-variant-list\n [productId]=\"this.id\"\n dataTableId=\"product-detail-variants-list\"\n [hideLanguageSelect]=\"true\"\n ></vdr-product-variant-list>\n </ng-template>\n <div class=\"mx-3\" *ngIf=\"(isNew$ | async) === false\">\n <a class=\"button\" [routerLink]=\"['manage-variants']\">\n <clr-icon shape=\"add-text\"></clr-icon>\n {{ 'catalog.manage-variants' | translate }}</a\n >\n </div>\n </vdr-card>\n </vdr-page-block>\n </vdr-page-detail-layout>\n</form>\n", styles: [":host ::ng-deep trix-toolbar{top:24px}.facets,.options{display:flex;flex-wrap:wrap;gap:3px}vdr-action-bar clr-toggle-wrapper{margin-top:12px}.variant-filter{flex:1;display:flex}.variant-filter input{flex:1;max-width:initial;border-radius:3px 0 0 3px!important}.variant-filter .icon-button{border:1px solid var(--color-component-border-300);background-color:var(--color-component-bg-100);border-radius:0 3px 3px 0;border-inline-start:none}.group-name{padding-inline-end:6px}.view-mode{display:flex;flex-direction:column;justify-content:space-between}@media screen and (min-width: 768px){.view-mode{flex-direction:row}}.edit-variants-btn{margin-top:0}.channel-assignment{flex-wrap:wrap;min-height:24px}.pagination-row{display:flex;align-items:baseline;justify-content:space-between}\n"] }]
|
|
3776
3776
|
}], ctorParameters: () => [{ type: ProductDetailService }, { type: i2.FormBuilder }, { type: i1.ModalService }, { type: i1.NotificationService }, { type: i1.DataService }, { type: i0.ChangeDetectorRef }] });
|
|
@@ -4054,10 +4054,10 @@ class ProductListComponent extends TypedBaseListComponent {
|
|
|
4054
4054
|
});
|
|
4055
4055
|
});
|
|
4056
4056
|
}
|
|
4057
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
4058
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
4057
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ProductListComponent, deps: [{ token: i1.DataService }, { token: i1.ModalService }, { token: i1.NotificationService }, { token: i1.JobQueueService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4058
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: ProductListComponent, isStandalone: false, selector: "vdr-products-list", usesInheritance: true, ngImport: i0, template: "<vdr-page-block>\n <vdr-action-bar>\n <vdr-ab-left>\n <vdr-language-selector\n [availableLanguageCodes]=\"availableLanguages$ | async\"\n [currentLanguageCode]=\"contentLanguage$ | async\"\n (languageCodeChange)=\"setLanguage($event)\"\n ></vdr-language-selector>\n </vdr-ab-left>\n <vdr-ab-right>\n <vdr-action-bar-items [locationId]=\"pageLocationId\"></vdr-action-bar-items>\n <a\n class=\"btn btn-primary mr-1\"\n [routerLink]=\"['./create']\"\n *vdrIfPermissions=\"['CreateCatalog', 'CreateProduct']\"\n >\n <clr-icon shape=\"plus\"></clr-icon>\n {{ 'catalog.create-new-product' | translate }}\n </a>\n <vdr-action-bar-dropdown-menu [alwaysShow]=\"true\" [locationId]=\"pageLocationId\">\n <button type=\"button\" vdrDropdownItem (click)=\"rebuildSearchIndex()\">\n <clr-icon shape=\"refresh\" class=\"\"></clr-icon>\n {{ 'catalog.rebuild-search-index' | translate }}\n </button>\n </vdr-action-bar-dropdown-menu>\n </vdr-ab-right>\n </vdr-action-bar>\n</vdr-page-block>\n<vdr-data-table-2\n class=\"mt-2\"\n [id]=\"dataTableListId\"\n [items]=\"items$ | async\"\n [itemsPerPage]=\"itemsPerPage$ | async\"\n [totalItems]=\"totalItems$ | async\"\n [currentPage]=\"currentPage$ | async\"\n [filters]=\"filters\"\n (pageChange)=\"setPageNumber($event)\"\n (itemsPerPageChange)=\"setItemsPerPage($event)\"\n (visibleColumnsChange)=\"setVisibleColumns($event)\"\n>\n <vdr-bulk-action-menu\n [locationId]=\"dataTableListId\"\n [hostComponent]=\"this\"\n [selectionManager]=\"selectionManager\"\n ></vdr-bulk-action-menu>\n <vdr-dt2-search\n [searchTermControl]=\"searchTermControl\"\n [searchTermPlaceholder]=\"'settings.search-by-product-name-or-sku' | translate\"\n />\n <vdr-dt2-column [heading]=\"'common.id' | translate\" id=\"id\" [hiddenByDefault]=\"true\" [sort]=\"sorts.get('id')\">\n <ng-template let-product=\"item\">\n {{ product.id }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column\n [heading]=\"'common.created-at' | translate\" id=\"created-at\"\n [hiddenByDefault]=\"true\"\n [sort]=\"sorts.get('createdAt')\"\n >\n <ng-template let-product=\"item\">\n {{ product.createdAt | localeDate : 'short' }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column\n [heading]=\"'common.updated-at' | translate\" id=\"updated-at\"\n [hiddenByDefault]=\"true\"\n [sort]=\"sorts.get('updatedAt')\"\n >\n <ng-template let-product=\"item\">\n {{ product.updatedAt | localeDate : 'short' }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.image' | translate\" id=\"image\">\n <ng-template let-product=\"item\">\n <div class=\"image-placeholder\">\n <img\n *ngIf=\"product.featuredAsset as asset; else imagePlaceholder\"\n [src]=\"asset | assetPreview : 'tiny'\"\n />\n <ng-template #imagePlaceholder>\n <div class=\"placeholder\">\n <clr-icon shape=\"image\" size=\"48\"></clr-icon>\n </div>\n </ng-template>\n </div>\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'catalog.name' | translate\" id=\"name\" [optional]=\"false\" [sort]=\"sorts.get('name')\">\n <ng-template let-product=\"item\">\n <a class=\"button-ghost\" [routerLink]=\"['./', product.id]\"\n ><span>{{ product.name }}</span\n ><clr-icon shape=\"arrow right\"\n /></a>\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.slug' | translate\" id=\"slug\" [sort]=\"sorts.get('slug')\">\n <ng-template let-product=\"item\">\n {{ product.slug }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.enabled' | translate\" id=\"enabled\">\n <ng-template let-product=\"item\">\n <vdr-chip *ngIf=\"product.enabled\" colorType=\"success\">{{\n 'common.enabled' | translate\n }}</vdr-chip>\n <vdr-chip *ngIf=\"!product.enabled\" colorType=\"warning\">{{\n 'common.disabled' | translate\n }}</vdr-chip>\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'catalog.number-of-variants' | translate\" id=\"number-of-variants\">\n <ng-template let-product=\"item\">\n {{ 'catalog.variant-count' | translate : { count: product.variantList?.totalItems } }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-custom-field-column\n *ngFor=\"let customField of customFields\"\n [customField]=\"customField\"\n [sorts]=\"sorts\"\n />\n</vdr-data-table-2>\n", styles: [".image-col{width:70px}.image-placeholder{width:50px;height:50px;margin-top:calc(var(--space-unit) * -1);margin-bottom:calc(var(--space-unit) * -1);background-color:var(--color-component-bg-200)}.image-placeholder img{border-radius:var(--border-radius-img)}.image-placeholder .placeholder{text-align:center;color:var(--color-grey-300)}.search-form{display:flex;align-items:center;width:100%}vdr-product-search-input{min-width:300px}@media screen and (max-width: 768px){vdr-product-search-input{min-width:100px}}.search-settings-menu{margin:0 12px}td.disabled{background-color:var(--color-component-bg-200)}.search-index-button{position:relative}.search-index-button vdr-status-badge{right:0;top:0}.run-updates-button{position:relative}.run-updates-button vdr-status-badge{left:10px;top:10px}.edit-button{margin-inline-end:24px}.sku{color:var(--color-text-300)}\n"], dependencies: [{ kind: "directive", type: i3.ClrIconCustomTag, selector: "clr-icon" }, { kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i1.ActionBarComponent, selector: "vdr-action-bar" }, { kind: "component", type: i1.ActionBarLeftComponent, selector: "vdr-ab-left", inputs: ["grow"] }, { kind: "component", type: i1.ActionBarRightComponent, selector: "vdr-ab-right", inputs: ["grow"] }, { kind: "component", type: i1.ActionBarDropdownMenuComponent, selector: "vdr-action-bar-dropdown-menu", inputs: ["alwaysShow"] }, { kind: "component", type: i1.ChipComponent, selector: "vdr-chip", inputs: ["icon", "invert", "colorFrom", "colorType"], outputs: ["iconClick"] }, { kind: "component", type: i1.LanguageSelectorComponent, selector: "vdr-language-selector", inputs: ["currentLanguageCode", "availableLanguageCodes", "disabled"], outputs: ["languageCodeChange"] }, { kind: "directive", type: i1.DropdownItemDirective, selector: "[vdrDropdownItem]" }, { kind: "directive", type: i1.IfPermissionsDirective, selector: "[vdrIfPermissions]", inputs: ["vdrIfPermissions", "vdrIfPermissionsElse"] }, { kind: "component", type: i1.ActionBarItemsComponent, selector: "vdr-action-bar-items" }, { kind: "component", type: i1.BulkActionMenuComponent, selector: "vdr-bulk-action-menu", inputs: ["locationId", "selectionManager", "hostComponent"] }, { kind: "component", type: i1.DataTable2Component, selector: "vdr-data-table-2", inputs: ["id", "items", "itemsPerPage", "currentPage", "totalItems", "emptyStateLabel", "filters", "activeIndex", "trackByPath"], outputs: ["pageChange", "itemsPerPageChange", "visibleColumnsChange"] }, { kind: "component", type: i1.DataTable2ColumnComponent, selector: "vdr-dt2-column", inputs: ["id", "expand", "heading", "align", "sort", "optional", "hiddenByDefault", "orderable"], exportAs: ["row"] }, { kind: "component", type: i1.DataTable2SearchComponent, selector: "vdr-dt2-search", inputs: ["searchTermControl", "searchTermPlaceholder"] }, { kind: "component", type: i1.DataTableCustomFieldColumnComponent, selector: "vdr-dt2-custom-field-column", inputs: ["customField", "sorts"], exportAs: ["row"] }, { kind: "component", type: i1.PageBlockComponent, selector: "vdr-page-block" }, { kind: "pipe", type: i3$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }, { kind: "pipe", type: i1.AssetPreviewPipe, name: "assetPreview" }, { kind: "pipe", type: i1.LocaleDatePipe, name: "localeDate" }] }); }
|
|
4059
4059
|
}
|
|
4060
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
4060
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ProductListComponent, decorators: [{
|
|
4061
4061
|
type: Component,
|
|
4062
4062
|
args: [{ selector: 'vdr-products-list', standalone: false, template: "<vdr-page-block>\n <vdr-action-bar>\n <vdr-ab-left>\n <vdr-language-selector\n [availableLanguageCodes]=\"availableLanguages$ | async\"\n [currentLanguageCode]=\"contentLanguage$ | async\"\n (languageCodeChange)=\"setLanguage($event)\"\n ></vdr-language-selector>\n </vdr-ab-left>\n <vdr-ab-right>\n <vdr-action-bar-items [locationId]=\"pageLocationId\"></vdr-action-bar-items>\n <a\n class=\"btn btn-primary mr-1\"\n [routerLink]=\"['./create']\"\n *vdrIfPermissions=\"['CreateCatalog', 'CreateProduct']\"\n >\n <clr-icon shape=\"plus\"></clr-icon>\n {{ 'catalog.create-new-product' | translate }}\n </a>\n <vdr-action-bar-dropdown-menu [alwaysShow]=\"true\" [locationId]=\"pageLocationId\">\n <button type=\"button\" vdrDropdownItem (click)=\"rebuildSearchIndex()\">\n <clr-icon shape=\"refresh\" class=\"\"></clr-icon>\n {{ 'catalog.rebuild-search-index' | translate }}\n </button>\n </vdr-action-bar-dropdown-menu>\n </vdr-ab-right>\n </vdr-action-bar>\n</vdr-page-block>\n<vdr-data-table-2\n class=\"mt-2\"\n [id]=\"dataTableListId\"\n [items]=\"items$ | async\"\n [itemsPerPage]=\"itemsPerPage$ | async\"\n [totalItems]=\"totalItems$ | async\"\n [currentPage]=\"currentPage$ | async\"\n [filters]=\"filters\"\n (pageChange)=\"setPageNumber($event)\"\n (itemsPerPageChange)=\"setItemsPerPage($event)\"\n (visibleColumnsChange)=\"setVisibleColumns($event)\"\n>\n <vdr-bulk-action-menu\n [locationId]=\"dataTableListId\"\n [hostComponent]=\"this\"\n [selectionManager]=\"selectionManager\"\n ></vdr-bulk-action-menu>\n <vdr-dt2-search\n [searchTermControl]=\"searchTermControl\"\n [searchTermPlaceholder]=\"'settings.search-by-product-name-or-sku' | translate\"\n />\n <vdr-dt2-column [heading]=\"'common.id' | translate\" id=\"id\" [hiddenByDefault]=\"true\" [sort]=\"sorts.get('id')\">\n <ng-template let-product=\"item\">\n {{ product.id }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column\n [heading]=\"'common.created-at' | translate\" id=\"created-at\"\n [hiddenByDefault]=\"true\"\n [sort]=\"sorts.get('createdAt')\"\n >\n <ng-template let-product=\"item\">\n {{ product.createdAt | localeDate : 'short' }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column\n [heading]=\"'common.updated-at' | translate\" id=\"updated-at\"\n [hiddenByDefault]=\"true\"\n [sort]=\"sorts.get('updatedAt')\"\n >\n <ng-template let-product=\"item\">\n {{ product.updatedAt | localeDate : 'short' }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.image' | translate\" id=\"image\">\n <ng-template let-product=\"item\">\n <div class=\"image-placeholder\">\n <img\n *ngIf=\"product.featuredAsset as asset; else imagePlaceholder\"\n [src]=\"asset | assetPreview : 'tiny'\"\n />\n <ng-template #imagePlaceholder>\n <div class=\"placeholder\">\n <clr-icon shape=\"image\" size=\"48\"></clr-icon>\n </div>\n </ng-template>\n </div>\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'catalog.name' | translate\" id=\"name\" [optional]=\"false\" [sort]=\"sorts.get('name')\">\n <ng-template let-product=\"item\">\n <a class=\"button-ghost\" [routerLink]=\"['./', product.id]\"\n ><span>{{ product.name }}</span\n ><clr-icon shape=\"arrow right\"\n /></a>\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.slug' | translate\" id=\"slug\" [sort]=\"sorts.get('slug')\">\n <ng-template let-product=\"item\">\n {{ product.slug }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.enabled' | translate\" id=\"enabled\">\n <ng-template let-product=\"item\">\n <vdr-chip *ngIf=\"product.enabled\" colorType=\"success\">{{\n 'common.enabled' | translate\n }}</vdr-chip>\n <vdr-chip *ngIf=\"!product.enabled\" colorType=\"warning\">{{\n 'common.disabled' | translate\n }}</vdr-chip>\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'catalog.number-of-variants' | translate\" id=\"number-of-variants\">\n <ng-template let-product=\"item\">\n {{ 'catalog.variant-count' | translate : { count: product.variantList?.totalItems } }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-custom-field-column\n *ngFor=\"let customField of customFields\"\n [customField]=\"customField\"\n [sorts]=\"sorts\"\n />\n</vdr-data-table-2>\n", styles: [".image-col{width:70px}.image-placeholder{width:50px;height:50px;margin-top:calc(var(--space-unit) * -1);margin-bottom:calc(var(--space-unit) * -1);background-color:var(--color-component-bg-200)}.image-placeholder img{border-radius:var(--border-radius-img)}.image-placeholder .placeholder{text-align:center;color:var(--color-grey-300)}.search-form{display:flex;align-items:center;width:100%}vdr-product-search-input{min-width:300px}@media screen and (max-width: 768px){vdr-product-search-input{min-width:100px}}.search-settings-menu{margin:0 12px}td.disabled{background-color:var(--color-component-bg-200)}.search-index-button{position:relative}.search-index-button vdr-status-badge{right:0;top:0}.run-updates-button{position:relative}.run-updates-button vdr-status-badge{left:10px;top:10px}.edit-button{margin-inline-end:24px}.sku{color:var(--color-text-300)}\n"] }]
|
|
4063
4063
|
}], ctorParameters: () => [{ type: i1.DataService }, { type: i1.ModalService }, { type: i1.NotificationService }, { type: i1.JobQueueService }] });
|
|
@@ -4097,10 +4097,10 @@ class VariantPriceDetailComponent {
|
|
|
4097
4097
|
this.taxCategoryIdChange$.next(changes.taxCategoryId.currentValue);
|
|
4098
4098
|
}
|
|
4099
4099
|
}
|
|
4100
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
4101
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
4100
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: VariantPriceDetailComponent, deps: [{ token: i1.DataService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4101
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: VariantPriceDetailComponent, isStandalone: false, selector: "vdr-variant-price-detail", inputs: { priceIncludesTax: "priceIncludesTax", price: "price", currencyCode: "currencyCode", taxCategoryId: "taxCategoryId" }, usesOnChanges: true, ngImport: i0, template: "<label class=\"clr-control-label\">{{ 'catalog.taxes' | translate }}</label>\n<div *ngIf=\"priceIncludesTax\" class=\"value\">\n {{ 'catalog.price-includes-tax-at' | translate: { rate: taxRate$ | async } }}\n</div>\n<div *ngIf=\"!priceIncludesTax\" class=\"value\">\n {{\n 'catalog.price-with-tax-in-default-zone'\n | translate: { price: grossPrice$ | async | localeCurrency: currencyCode, rate: taxRate$ | async }\n }}\n</div>\n", styles: [":host{display:flex;flex-direction:column}.value{margin-top:3px}\n"], dependencies: [{ kind: "directive", type: i3.ClrLabel, selector: "label", inputs: ["id", "for"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i3$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }, { kind: "pipe", type: i1.LocaleCurrencyPipe, name: "localeCurrency" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
4102
4102
|
}
|
|
4103
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
4103
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: VariantPriceDetailComponent, decorators: [{
|
|
4104
4104
|
type: Component,
|
|
4105
4105
|
args: [{ selector: 'vdr-variant-price-detail', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<label class=\"clr-control-label\">{{ 'catalog.taxes' | translate }}</label>\n<div *ngIf=\"priceIncludesTax\" class=\"value\">\n {{ 'catalog.price-includes-tax-at' | translate: { rate: taxRate$ | async } }}\n</div>\n<div *ngIf=\"!priceIncludesTax\" class=\"value\">\n {{\n 'catalog.price-with-tax-in-default-zone'\n | translate: { price: grossPrice$ | async | localeCurrency: currencyCode, rate: taxRate$ | async }\n }}\n</div>\n", styles: [":host{display:flex;flex-direction:column}.value{margin-top:3px}\n"] }]
|
|
4106
4106
|
}], ctorParameters: () => [{ type: i1.DataService }], propDecorators: { priceIncludesTax: [{
|
|
@@ -4127,10 +4127,10 @@ class VariantPriceStrategyDetailComponent {
|
|
|
4127
4127
|
return this.variant.price !== defaultPrice.price;
|
|
4128
4128
|
}
|
|
4129
4129
|
}
|
|
4130
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
4131
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
4130
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: VariantPriceStrategyDetailComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4131
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: VariantPriceStrategyDetailComponent, isStandalone: false, selector: "vdr-variant-price-strategy-detail", inputs: { channelPriceIncludesTax: "channelPriceIncludesTax", variant: "variant", channelDefaultCurrencyCode: "channelDefaultCurrencyCode" }, ngImport: i0, template: "<div *ngIf=\"calculatedPriceDiffersFromInputPrice()\" class=\"price-strategy-detail\">\n <vdr-form-item\n [label]=\"'catalog.calculated-price' | translate\"\n [tooltip]=\"'catalog.calculated-price-tooltip' | translate\"\n for=\"price\"\n >\n </vdr-form-item>\n <div class=\"form-grid mt-2\">\n <vdr-form-item [label]=\"'common.price' | translate\">\n {{ variant.price | localeCurrency : variant.currencyCode }}\n </vdr-form-item>\n <vdr-form-item [label]=\"'common.price-with-tax' | translate\">\n {{ variant.priceWithTax | localeCurrency : variant.currencyCode }}\n </vdr-form-item>\n </div>\n</div>\n", styles: [":host{display:block}.price-strategy-detail{margin-top:calc(var(--space-unit) * 2);padding-top:calc(var(--space-unit) * 2);border-top:1px solid var(--color-weight-150)}\n"], dependencies: [{ kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i1.FormItemComponent, selector: "vdr-form-item", inputs: ["label", "tooltip"] }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }, { kind: "pipe", type: i1.LocaleCurrencyPipe, name: "localeCurrency" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
4132
4132
|
}
|
|
4133
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
4133
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: VariantPriceStrategyDetailComponent, decorators: [{
|
|
4134
4134
|
type: Component,
|
|
4135
4135
|
args: [{ selector: 'vdr-variant-price-strategy-detail', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<div *ngIf=\"calculatedPriceDiffersFromInputPrice()\" class=\"price-strategy-detail\">\n <vdr-form-item\n [label]=\"'catalog.calculated-price' | translate\"\n [tooltip]=\"'catalog.calculated-price-tooltip' | translate\"\n for=\"price\"\n >\n </vdr-form-item>\n <div class=\"form-grid mt-2\">\n <vdr-form-item [label]=\"'common.price' | translate\">\n {{ variant.price | localeCurrency : variant.currencyCode }}\n </vdr-form-item>\n <vdr-form-item [label]=\"'common.price-with-tax' | translate\">\n {{ variant.priceWithTax | localeCurrency : variant.currencyCode }}\n </vdr-form-item>\n </div>\n</div>\n", styles: [":host{display:block}.price-strategy-detail{margin-top:calc(var(--space-unit) * 2);padding-top:calc(var(--space-unit) * 2);border-top:1px solid var(--color-weight-150)}\n"] }]
|
|
4136
4136
|
}], propDecorators: { channelPriceIncludesTax: [{
|
|
@@ -4174,10 +4174,10 @@ class ProductVariantQuickJumpComponent {
|
|
|
4174
4174
|
.then(() => (this.selectedVariantId = undefined));
|
|
4175
4175
|
}
|
|
4176
4176
|
}
|
|
4177
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
4178
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
4177
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ProductVariantQuickJumpComponent, deps: [{ token: i1.DataService }, { token: i1$1.Router }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4178
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: ProductVariantQuickJumpComponent, isStandalone: false, selector: "vdr-product-variant-quick-jump", inputs: { productId: "productId" }, ngImport: i0, template: "<ng-select\n *ngIf=\"(variants$ | async)?.length > 1\"\n [items]=\"variants$ | async\"\n appendTo=\"body\"\n bindValue=\"id\"\n [(ngModel)]=\"selectedVariantId\"\n [searchFn]=\"searchFn\"\n [clearable]=\"false\"\n [placeholder]=\"'catalog.quick-jump-placeholder' | translate\"\n (change)=\"onSelect($event)\"\n>\n <ng-template ng-option-tmp let-item=\"item\" let-index=\"index\" let-search=\"searchTerm\">\n {{ item.name }} ({{ item.sku }})\n </ng-template>\n</ng-select>\n", styles: [""], dependencies: [{ kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i5$1.NgSelectComponent, selector: "ng-select", inputs: ["ariaLabelDropdown", "bindLabel", "bindValue", "ariaLabel", "markFirst", "placeholder", "fixedPlaceholder", "notFoundText", "typeToSearchText", "preventToggleOnRightClick", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "tabFocusOnClearButton", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "ngClass", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd", "deselectOnClick", "keyDownFn"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }, { kind: "directive", type: i5$1.NgOptionTemplateDirective, selector: "[ng-option-tmp]" }, { kind: "pipe", type: i3$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
4179
4179
|
}
|
|
4180
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
4180
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ProductVariantQuickJumpComponent, decorators: [{
|
|
4181
4181
|
type: Component,
|
|
4182
4182
|
args: [{ selector: 'vdr-product-variant-quick-jump', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<ng-select\n *ngIf=\"(variants$ | async)?.length > 1\"\n [items]=\"variants$ | async\"\n appendTo=\"body\"\n bindValue=\"id\"\n [(ngModel)]=\"selectedVariantId\"\n [searchFn]=\"searchFn\"\n [clearable]=\"false\"\n [placeholder]=\"'catalog.quick-jump-placeholder' | translate\"\n (change)=\"onSelect($event)\"\n>\n <ng-template ng-option-tmp let-item=\"item\" let-index=\"index\" let-search=\"searchTerm\">\n {{ item.name }} ({{ item.sku }})\n </ng-template>\n</ng-select>\n" }]
|
|
4183
4183
|
}], ctorParameters: () => [{ type: i1.DataService }, { type: i1$1.Router }], propDecorators: { productId: [{
|
|
@@ -4432,10 +4432,10 @@ class ProductVariantDetailComponent extends TypedBaseDetailComponent {
|
|
|
4432
4432
|
: undefined,
|
|
4433
4433
|
};
|
|
4434
4434
|
}
|
|
4435
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
4436
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: ProductVariantDetailComponent, isStandalone: false, selector: "vdr-product-variant-detail", usesInheritance: true, ngImport: i0, template: "<vdr-page-block>\n <vdr-action-bar>\n <vdr-ab-left [grow]=\"true\">\n <div class=\"flex center\">\n <ng-container *ngIf=\"availableLanguages$ | async as availableLanguages\">\n <vdr-language-selector\n *ngIf=\"availableLanguages.length > 1\"\n class=\"mr-2\"\n [disabled]=\"isNew$ | async\"\n [availableLanguageCodes]=\"availableLanguages\"\n [currentLanguageCode]=\"languageCode$ | async\"\n (languageCodeChange)=\"setLanguage($event)\"\n ></vdr-language-selector>\n </ng-container>\n <vdr-product-variant-quick-jump [productId]=\"entity?.product.id\" />\n </div>\n </vdr-ab-left>\n\n <vdr-ab-right>\n <vdr-action-bar-items locationId=\"product-variant-detail\"></vdr-action-bar-items>\n <button\n *vdrIfPermissions=\"['UpdateCatalog', 'UpdateProduct']\"\n class=\"btn btn-primary\"\n (click)=\"save()\"\n [disabled]=\"\n (detailForm.invalid ||\n stockLevelsForm.invalid ||\n pricesForm.invalid ||\n (detailForm.pristine && stockLevelsForm.pristine && pricesForm.pristine)) &&\n !assetsChanged()\n \"\n >\n {{ 'common.update' | translate }}\n </button>\n <vdr-action-bar-dropdown-menu locationId=\"product-variant-detail\"></vdr-action-bar-dropdown-menu>\n </vdr-ab-right>\n </vdr-action-bar>\n</vdr-page-block>\n<form class=\"form\" [formGroup]=\"detailForm\" *ngIf=\"entity$ | async as variant\">\n <vdr-page-detail-layout>\n <vdr-page-detail-sidebar\n ><vdr-card>\n <vdr-form-field [label]=\"'catalog.visibility' | translate\" for=\"visibility\">\n <clr-toggle-wrapper *vdrIfPermissions=\"['UpdateCatalog', 'UpdateProduct']\">\n <input\n type=\"checkbox\"\n clrToggle\n name=\"enabled\"\n [formControl]=\"detailForm.get(['enabled'])\"\n />\n <label>{{ 'common.enabled' | translate }}</label>\n </clr-toggle-wrapper>\n </vdr-form-field>\n </vdr-card>\n <vdr-card *ngIf=\"variant.options.length\" [title]=\"'catalog.product-options' | translate\">\n <div class=\"options\">\n <vdr-chip\n *ngFor=\"let option of variant.options | sort : 'groupId'\"\n [colorFrom]=\"optionGroupCode(option.groupId)\"\n [invert]=\"true\"\n >\n <span>{{ optionGroupCode(option.groupId) }}:</span>\n {{ optionName(option) }}\n </vdr-chip>\n </div>\n <div>\n <a\n [routerLink]=\"['../../', 'options']\"\n class=\"button-small mt-2\"\n *vdrIfPermissions=\"updatePermissions\"\n >\n <clr-icon shape=\"pencil\"></clr-icon>\n {{ 'catalog.edit-options' | translate }}\n </a>\n </div>\n </vdr-card>\n <vdr-card [title]=\"'catalog.facets' | translate\">\n <div class=\"facets\">\n <vdr-facet-value-chip\n *ngFor=\"let facetValue of facetValues$ | async\"\n [facetValue]=\"facetValue\"\n [removable]=\"updatePermissions | hasPermission\"\n (remove)=\"removeFacetValue(facetValue.id)\"\n ></vdr-facet-value-chip>\n </div>\n <div>\n <button\n class=\"button-small mt-2\"\n *vdrIfPermissions=\"updatePermissions\"\n (click)=\"selectFacetValue()\"\n >\n <clr-icon shape=\"plus\"></clr-icon>\n {{ 'catalog.add-facets' | translate }}\n </button>\n </div>\n </vdr-card>\n\n <vdr-card>\n <vdr-page-entity-info *ngIf=\"entity$ | async as entity\" [entity]=\"entity\" />\n </vdr-card>\n </vdr-page-detail-sidebar>\n\n <vdr-page-block>\n <button type=\"submit\" hidden x-data=\"prevents enter key from triggering other buttons\"></button>\n <vdr-card>\n <div class=\"form-grid\">\n <vdr-form-field [label]=\"'common.name' | translate\" for=\"name\">\n <input\n id=\"name\"\n type=\"text\"\n formControlName=\"name\"\n [readonly]=\"!(['UpdateCatalog', 'UpdateProduct'] | hasPermission)\"\n />\n </vdr-form-field>\n <vdr-form-field [label]=\"'catalog.sku' | translate\" for=\"sku\">\n <input\n id=\"sku\"\n type=\"text\"\n formControlName=\"sku\"\n [readonly]=\"!(updatePermissions | hasPermission)\"\n />\n </vdr-form-field>\n </div>\n </vdr-card>\n <vdr-card [title]=\"'common.custom-fields' | translate\" *ngIf=\"customFields.length\">\n <vdr-tabbed-custom-fields\n entityName=\"ProductVariant\"\n [customFields]=\"customFields\"\n [customFieldsFormGroup]=\"detailForm.get('customFields')\"\n [readonly]=\"!(updatePermissions | hasPermission)\"\n />\n </vdr-card>\n <vdr-custom-detail-component-host\n locationId=\"product-variant-detail\"\n [entity$]=\"entity$\"\n [detailForm]=\"detailForm\"\n />\n <vdr-card [title]=\"'catalog.assets' | translate\">\n <vdr-assets\n [assets]=\"assetChanges.assets || variant.assets\"\n [featuredAsset]=\"assetChanges.featuredAsset || variant.featuredAsset\"\n [updatePermissions]=\"updatePermissions\"\n (change)=\"assetChanges = $event\"\n />\n </vdr-card>\n <vdr-card [title]=\"'catalog.price-and-tax' | translate\">\n <div class=\"form-grid\">\n <vdr-form-field [label]=\"'catalog.tax-category' | translate\" for=\"taxCategory\">\n <select name=\"taxCategory\" formControlName=\"taxCategoryId\">\n <option\n *ngFor=\"let taxCategory of taxCategories$ | async\"\n [value]=\"taxCategory.id\"\n >\n {{ taxCategory.name }}\n </option>\n </select>\n </vdr-form-field>\n </div>\n <div class=\"form-grid prices\" *ngFor=\"let price of pricesForm.controls\" [formGroup]=\"price\">\n <vdr-form-field\n [label]=\"\n ('catalog.price' | translate) +\n (1 < pricesForm.length ? ' (' + price.value.currencyCode + ')' : '')\n \"\n [tooltip]=\"\n 1 < pricesForm.length && price.value.currencyCode === channelDefaultCurrencyCode\n ? ('catalog.default-currency' | translate)\n : undefined\n \"\n for=\"price\"\n >\n <div class=\"price-wrapper\" [class.pending-deletion]=\"price.value.delete === true\">\n <vdr-currency-input\n name=\"price\"\n [currencyCode]=\"price.value.currencyCode\"\n [readonly]=\"\n !(updatePermissions | hasPermission) || price.value.delete === true\n \"\n formControlName=\"price\"\n />\n <div *ngIf=\"1 < pricesForm.controls.length\">\n <button\n class=\"button-small delete-button\"\n [disabled]=\"price.value.currencyCode === channelDefaultCurrencyCode\"\n (click)=\"toggleDeletePrice(price.get('delete'))\"\n >\n <clr-icon shape=\"trash\"></clr-icon>\n </button>\n </div>\n </div>\n </vdr-form-field>\n <vdr-variant-price-detail\n [price]=\"price.value.price\"\n [currencyCode]=\"price.value.currencyCode\"\n [priceIncludesTax]=\"channelPriceIncludesTax$ | async\"\n [taxCategoryId]=\"detailForm.get('taxCategoryId')!.value\"\n />\n\n <div class=\"form-grid-span\" *ngIf=\"customPriceFields.length\">\n <div class=\"title-row\">\n <span class=\"title\">{{ 'common.custom-fields' | translate }}</span>\n </div>\n <vdr-tabbed-custom-fields\n entityName=\"ProductVariantPrice\"\n [customFields]=\"customPriceFields\"\n [customFieldsFormGroup]=\"price.get(['customFields'])\"\n [readonly]=\"!(updatePermissions | hasPermission)\"\n />\n </div>\n </div>\n\n <vdr-variant-price-strategy-detail\n [channelPriceIncludesTax]=\"channelPriceIncludesTax$ | async\"\n [channelDefaultCurrencyCode]=\"channelDefaultCurrencyCode\"\n [variant]=\"variant\"\n />\n\n <ng-container *ngIf=\"unusedCurrencyCodes$ | async as unusedCurrencyCodes\">\n <div *ngIf=\"unusedCurrencyCodes.length\">\n <vdr-dropdown>\n <button class=\"button mt-2\" vdrDropdownTrigger>\n <clr-icon shape=\"plus\"></clr-icon>\n {{ 'catalog.add-price-in-another-currency' | translate }}\n <clr-icon shape=\"ellipsis-vertical\"></clr-icon>\n </button>\n <vdr-dropdown-menu>\n <button\n vdrDropdownItem\n *ngFor=\"let currencyCode of unusedCurrencyCodes\"\n (click)=\"addPriceInCurrency(currencyCode)\"\n >\n {{ currencyCode | localeCurrencyName }}\n </button>\n </vdr-dropdown-menu>\n </vdr-dropdown>\n </div>\n </ng-container>\n </vdr-card>\n <vdr-card [title]=\"'catalog.stock-levels' | translate\">\n <div class=\"form-grid\">\n <vdr-form-field\n for=\"track-inventory\"\n [label]=\"'catalog.track-inventory' | translate\"\n [tooltip]=\"'catalog.track-inventory-tooltip' | translate\"\n >\n <select\n name=\"track-inventory\"\n formControlName=\"trackInventory\"\n [disabled]=\"!(updatePermissions | hasPermission)\"\n >\n <option [value]=\"GlobalFlag.TRUE\">\n {{ 'catalog.track-inventory-true' | translate }}\n </option>\n <option [value]=\"GlobalFlag.FALSE\">\n {{ 'catalog.track-inventory-false' | translate }}\n </option>\n <option [value]=\"GlobalFlag.INHERIT\">\n {{ 'catalog.track-inventory-inherit' | translate }}\n </option>\n </select>\n </vdr-form-field>\n\n <vdr-form-item\n [label]=\"'catalog.out-of-stock-threshold' | translate\"\n [tooltip]=\"'catalog.out-of-stock-threshold-tooltip' | translate\"\n >\n <input\n type=\"number\"\n formControlName=\"outOfStockThreshold\"\n [readonly]=\"!(updatePermissions | hasPermission)\"\n [vdrDisabled]=\"\n detailForm.get('useGlobalOutOfStockThreshold')?.value !== false ||\n inventoryIsNotTracked(detailForm)\n \"\n />\n <clr-toggle-wrapper>\n <input\n type=\"checkbox\"\n clrToggle\n name=\"useGlobalOutOfStockThreshold\"\n formControlName=\"useGlobalOutOfStockThreshold\"\n [vdrDisabled]=\"\n !(updatePermissions | hasPermission) || inventoryIsNotTracked(detailForm)\n \"\n />\n <label\n >{{ 'catalog.use-global-value' | translate }} ({{\n globalOutOfStockThreshold\n }})</label\n >\n </clr-toggle-wrapper>\n </vdr-form-item>\n </div>\n <div\n class=\"form-grid stock-levels\"\n *ngFor=\"let stockLevel of stockLevelsForm.controls\"\n [formGroup]=\"stockLevel\"\n >\n <vdr-form-field\n [label]=\"\n stockLevel.get('stockLocationName')?.value +\n ': ' +\n ('catalog.stock-on-hand' | translate)\n \"\n [for]=\"'stockOnHand_' + stockLevel.get('stockLocationId')?.value\"\n >\n <input\n [id]=\"'stockOnHand_' + stockLevel.get('stockLocationId')?.value\"\n type=\"number\"\n formControlName=\"stockOnHand\"\n [readonly]=\"!(updatePermissions | hasPermission)\"\n />\n </vdr-form-field>\n <vdr-form-item\n [label]=\"\n stockLevel.get('stockLocationName')?.value +\n ': ' +\n ('catalog.stock-allocated' | translate)\n \"\n >\n {{ stockLevel.get('stockAllocated')?.value }}\n </vdr-form-item>\n </div>\n <ng-container *ngIf=\"unusedStockLocation$ | async as unusedStockLocations\">\n <div *ngIf=\"unusedStockLocations.length\">\n <vdr-dropdown>\n <button class=\"button mt-2\" vdrDropdownTrigger>\n <clr-icon shape=\"plus\"></clr-icon>\n {{ 'catalog.add-stock-location' | translate }}\n <clr-icon shape=\"ellipsis-vertical\"></clr-icon>\n </button>\n <vdr-dropdown-menu>\n <button\n vdrDropdownItem\n *ngFor=\"let stockLocation of unusedStockLocations\"\n (click)=\"addStockLocation(stockLocation)\"\n >\n <clr-icon shape=\"map-marker\"></clr-icon> {{ stockLocation.name }}\n </button>\n </vdr-dropdown-menu>\n </vdr-dropdown>\n </div>\n </ng-container>\n </vdr-card>\n </vdr-page-block>\n </vdr-page-detail-layout>\n</form>\n", styles: [".facets,.options{display:flex;flex-wrap:wrap;gap:3px}vdr-product-variant-quick-jump{flex:1;margin-inline-end:calc(var(--space-unit) * 2)}.stock-levels,.prices{margin-top:calc(var(--space-unit) * 2);padding-top:calc(var(--space-unit) * 2);border-top:1px solid var(--color-weight-150)}.price-wrapper{display:flex;align-items:center;gap:var(--space-unit);width:100%}.price-wrapper.pending-deletion vdr-currency-input{opacity:.7}.price-wrapper.pending-deletion .delete-button{background-color:var(--color-error-700);color:var(--color-error-100)}.title-row{display:flex;justify-content:space-between;align-items:center}.title{font-size:var(--font-size-base)}\n"], dependencies: [{ kind: "directive", type: i3.ClrIconCustomTag, selector: "clr-icon" }, { kind: "directive", type: i3.ClrLabel, selector: "label", inputs: ["id", "for"] }, { kind: "directive", type: i3.ClrCheckbox, selector: "[clrCheckbox],[clrToggle]" }, { kind: "component", type: i3.ClrCheckboxWrapper, selector: "clr-checkbox-wrapper,clr-toggle-wrapper" }, { kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i2.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i1.ActionBarComponent, selector: "vdr-action-bar" }, { kind: "component", type: i1.ActionBarLeftComponent, selector: "vdr-ab-left", inputs: ["grow"] }, { kind: "component", type: i1.ActionBarRightComponent, selector: "vdr-ab-right", inputs: ["grow"] }, { kind: "component", type: i1.ActionBarDropdownMenuComponent, selector: "vdr-action-bar-dropdown-menu", inputs: ["alwaysShow"] }, { kind: "component", type: i1.AssetsComponent, selector: "vdr-assets", inputs: ["assets", "featuredAsset", "compact", "updatePermissions", "multiSelect"], outputs: ["change"] }, { kind: "component", type: i1.ChipComponent, selector: "vdr-chip", inputs: ["icon", "invert", "colorFrom", "colorType"], outputs: ["iconClick"] }, { kind: "component", type: i1.CurrencyInputComponent, selector: "vdr-currency-input", inputs: ["disabled", "readonly", "value", "currencyCode"], outputs: ["valueChange"] }, { kind: "component", type: i1.FacetValueChipComponent, selector: "vdr-facet-value-chip", inputs: ["facetValue", "removable", "displayFacetName"], outputs: ["remove"] }, { kind: "component", type: i1.FormFieldComponent, selector: "vdr-form-field", inputs: ["label", "for", "tooltip", "errors", "readOnlyToggle"], outputs: ["readOnlyToggleChange"] }, { kind: "directive", type: i1.FormFieldControlDirective, selector: "input, textarea, select, vdr-currency-input" }, { kind: "component", type: i1.FormItemComponent, selector: "vdr-form-item", inputs: ["label", "tooltip"] }, { kind: "component", type: i1.LanguageSelectorComponent, selector: "vdr-language-selector", inputs: ["currentLanguageCode", "availableLanguageCodes", "disabled"], outputs: ["languageCodeChange"] }, { kind: "component", type: i1.DropdownComponent, selector: "vdr-dropdown", inputs: ["manualToggle"] }, { kind: "component", type: i1.DropdownMenuComponent, selector: "vdr-dropdown-menu", inputs: ["vdrPosition", "customClasses"] }, { kind: "directive", type: i1.DropdownTriggerDirective, selector: "[vdrDropdownTrigger]" }, { kind: "directive", type: i1.DropdownItemDirective, selector: "[vdrDropdownItem]" }, { kind: "directive", type: i1.IfPermissionsDirective, selector: "[vdrIfPermissions]", inputs: ["vdrIfPermissions", "vdrIfPermissionsElse"] }, { kind: "component", type: i1.ActionBarItemsComponent, selector: "vdr-action-bar-items" }, { kind: "directive", type: i1.DisabledDirective, selector: "[vdrDisabled]", inputs: ["vdrDisabled"] }, { kind: "component", type: i1.TabbedCustomFieldsComponent, selector: "vdr-tabbed-custom-fields", inputs: ["entityName", "customFields", "customFieldsFormGroup", "readonly", "compact", "showLabel"] }, { kind: "component", type: i1.CustomDetailComponentHostComponent, selector: "vdr-custom-detail-component-host", inputs: ["locationId", "entity$", "detailForm"] }, { kind: "component", type: i1.PageBlockComponent, selector: "vdr-page-block" }, { kind: "component", type: i1.PageEntityInfoComponent, selector: "vdr-page-entity-info", inputs: ["entity"] }, { kind: "component", type: i1.PageDetailLayoutComponent, selector: "vdr-page-detail-layout" }, { kind: "component", type: i1.PageDetailSidebarComponent, selector: "vdr-page-detail-sidebar" }, { kind: "component", type: i1.CardComponent, selector: "vdr-card", inputs: ["title", "paddingX"] }, { kind: "component", type: VariantPriceDetailComponent, selector: "vdr-variant-price-detail", inputs: ["priceIncludesTax", "price", "currencyCode", "taxCategoryId"] }, { kind: "component", type: VariantPriceStrategyDetailComponent, selector: "vdr-variant-price-strategy-detail", inputs: ["channelPriceIncludesTax", "variant", "channelDefaultCurrencyCode"] }, { kind: "component", type: ProductVariantQuickJumpComponent, selector: "vdr-product-variant-quick-jump", inputs: ["productId"] }, { kind: "pipe", type: i3$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }, { kind: "pipe", type: i1.LocaleCurrencyNamePipe, name: "localeCurrencyName" }, { kind: "pipe", type: i1.SortPipe, name: "sort" }, { kind: "pipe", type: i1.HasPermissionPipe, name: "hasPermission" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
4435
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ProductVariantDetailComponent, deps: [{ token: ProductDetailService }, { token: i2.FormBuilder }, { token: i1.ModalService }, { token: i1.NotificationService }, { token: i1.DataService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4436
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: ProductVariantDetailComponent, isStandalone: false, selector: "vdr-product-variant-detail", usesInheritance: true, ngImport: i0, template: "<vdr-page-block>\n <vdr-action-bar>\n <vdr-ab-left [grow]=\"true\">\n <div class=\"flex center\">\n <ng-container *ngIf=\"availableLanguages$ | async as availableLanguages\">\n <vdr-language-selector\n *ngIf=\"availableLanguages.length > 1\"\n class=\"mr-2\"\n [disabled]=\"isNew$ | async\"\n [availableLanguageCodes]=\"availableLanguages\"\n [currentLanguageCode]=\"languageCode$ | async\"\n (languageCodeChange)=\"setLanguage($event)\"\n ></vdr-language-selector>\n </ng-container>\n <vdr-product-variant-quick-jump [productId]=\"entity?.product.id\" />\n </div>\n </vdr-ab-left>\n\n <vdr-ab-right>\n <vdr-action-bar-items locationId=\"product-variant-detail\"></vdr-action-bar-items>\n <button\n *vdrIfPermissions=\"['UpdateCatalog', 'UpdateProduct']\"\n class=\"btn btn-primary\"\n (click)=\"save()\"\n [disabled]=\"\n (detailForm.invalid ||\n stockLevelsForm.invalid ||\n pricesForm.invalid ||\n (detailForm.pristine && stockLevelsForm.pristine && pricesForm.pristine)) &&\n !assetsChanged()\n \"\n >\n {{ 'common.update' | translate }}\n </button>\n <vdr-action-bar-dropdown-menu locationId=\"product-variant-detail\"></vdr-action-bar-dropdown-menu>\n </vdr-ab-right>\n </vdr-action-bar>\n</vdr-page-block>\n<form class=\"form\" [formGroup]=\"detailForm\" *ngIf=\"entity$ | async as variant\">\n <vdr-page-detail-layout>\n <vdr-page-detail-sidebar\n ><vdr-card>\n <vdr-form-field [label]=\"'catalog.visibility' | translate\" for=\"visibility\">\n <clr-toggle-wrapper *vdrIfPermissions=\"['UpdateCatalog', 'UpdateProduct']\">\n <input\n type=\"checkbox\"\n clrToggle\n name=\"enabled\"\n [formControl]=\"detailForm.get(['enabled'])\"\n />\n <label>{{ 'common.enabled' | translate }}</label>\n </clr-toggle-wrapper>\n </vdr-form-field>\n </vdr-card>\n <vdr-card *ngIf=\"variant.options.length\" [title]=\"'catalog.product-options' | translate\">\n <div class=\"options\">\n <vdr-chip\n *ngFor=\"let option of variant.options | sort : 'groupId'\"\n [colorFrom]=\"optionGroupCode(option.groupId)\"\n [invert]=\"true\"\n >\n <span>{{ optionGroupCode(option.groupId) }}:</span>\n {{ optionName(option) }}\n </vdr-chip>\n </div>\n <div>\n <a\n [routerLink]=\"['../../', 'options']\"\n class=\"button-small mt-2\"\n *vdrIfPermissions=\"updatePermissions\"\n >\n <clr-icon shape=\"pencil\"></clr-icon>\n {{ 'catalog.edit-options' | translate }}\n </a>\n </div>\n </vdr-card>\n <vdr-card [title]=\"'catalog.facets' | translate\">\n <div class=\"facets\">\n <vdr-facet-value-chip\n *ngFor=\"let facetValue of facetValues$ | async\"\n [facetValue]=\"facetValue\"\n [removable]=\"updatePermissions | hasPermission\"\n (remove)=\"removeFacetValue(facetValue.id)\"\n ></vdr-facet-value-chip>\n </div>\n <div>\n <button\n class=\"button-small mt-2\"\n *vdrIfPermissions=\"updatePermissions\"\n (click)=\"selectFacetValue()\"\n >\n <clr-icon shape=\"plus\"></clr-icon>\n {{ 'catalog.add-facets' | translate }}\n </button>\n </div>\n </vdr-card>\n\n <vdr-card>\n <vdr-page-entity-info *ngIf=\"entity$ | async as entity\" [entity]=\"entity\" />\n </vdr-card>\n </vdr-page-detail-sidebar>\n\n <vdr-page-block>\n <button type=\"submit\" hidden x-data=\"prevents enter key from triggering other buttons\"></button>\n <vdr-card>\n <div class=\"form-grid\">\n <vdr-form-field [label]=\"'common.name' | translate\" for=\"name\">\n <input\n id=\"name\"\n type=\"text\"\n formControlName=\"name\"\n [readonly]=\"!(['UpdateCatalog', 'UpdateProduct'] | hasPermission)\"\n />\n </vdr-form-field>\n <vdr-form-field [label]=\"'catalog.sku' | translate\" for=\"sku\">\n <input\n id=\"sku\"\n type=\"text\"\n formControlName=\"sku\"\n [readonly]=\"!(updatePermissions | hasPermission)\"\n />\n </vdr-form-field>\n </div>\n </vdr-card>\n <vdr-card [title]=\"'common.custom-fields' | translate\" *ngIf=\"customFields.length\">\n <vdr-tabbed-custom-fields\n entityName=\"ProductVariant\"\n [customFields]=\"customFields\"\n [customFieldsFormGroup]=\"detailForm.get('customFields')\"\n [readonly]=\"!(updatePermissions | hasPermission)\"\n />\n </vdr-card>\n <vdr-custom-detail-component-host\n locationId=\"product-variant-detail\"\n [entity$]=\"entity$\"\n [detailForm]=\"detailForm\"\n />\n <vdr-card [title]=\"'catalog.assets' | translate\">\n <vdr-assets\n [assets]=\"assetChanges.assets || variant.assets\"\n [featuredAsset]=\"assetChanges.featuredAsset || variant.featuredAsset\"\n [updatePermissions]=\"updatePermissions\"\n (change)=\"assetChanges = $event\"\n />\n </vdr-card>\n <vdr-card [title]=\"'catalog.price-and-tax' | translate\">\n <div class=\"form-grid\">\n <vdr-form-field [label]=\"'catalog.tax-category' | translate\" for=\"taxCategory\">\n <select name=\"taxCategory\" formControlName=\"taxCategoryId\">\n <option\n *ngFor=\"let taxCategory of taxCategories$ | async\"\n [value]=\"taxCategory.id\"\n >\n {{ taxCategory.name }}\n </option>\n </select>\n </vdr-form-field>\n </div>\n <div class=\"form-grid prices\" *ngFor=\"let price of pricesForm.controls\" [formGroup]=\"price\">\n <vdr-form-field\n [label]=\"\n ('catalog.price' | translate) +\n (1 < pricesForm.length ? ' (' + price.value.currencyCode + ')' : '')\n \"\n [tooltip]=\"\n 1 < pricesForm.length && price.value.currencyCode === channelDefaultCurrencyCode\n ? ('catalog.default-currency' | translate)\n : undefined\n \"\n for=\"price\"\n >\n <div class=\"price-wrapper\" [class.pending-deletion]=\"price.value.delete === true\">\n <vdr-currency-input\n name=\"price\"\n [currencyCode]=\"price.value.currencyCode\"\n [readonly]=\"\n !(updatePermissions | hasPermission) || price.value.delete === true\n \"\n formControlName=\"price\"\n />\n <div *ngIf=\"1 < pricesForm.controls.length\">\n <button\n class=\"button-small delete-button\"\n [disabled]=\"price.value.currencyCode === channelDefaultCurrencyCode\"\n (click)=\"toggleDeletePrice(price.get('delete'))\"\n >\n <clr-icon shape=\"trash\"></clr-icon>\n </button>\n </div>\n </div>\n </vdr-form-field>\n <vdr-variant-price-detail\n [price]=\"price.value.price\"\n [currencyCode]=\"price.value.currencyCode\"\n [priceIncludesTax]=\"channelPriceIncludesTax$ | async\"\n [taxCategoryId]=\"detailForm.get('taxCategoryId')!.value\"\n />\n\n <div class=\"form-grid-span\" *ngIf=\"customPriceFields.length\">\n <div class=\"title-row\">\n <span class=\"title\">{{ 'common.custom-fields' | translate }}</span>\n </div>\n <vdr-tabbed-custom-fields\n entityName=\"ProductVariantPrice\"\n [customFields]=\"customPriceFields\"\n [customFieldsFormGroup]=\"price.get(['customFields'])\"\n [readonly]=\"!(updatePermissions | hasPermission)\"\n />\n </div>\n </div>\n\n <vdr-variant-price-strategy-detail\n [channelPriceIncludesTax]=\"channelPriceIncludesTax$ | async\"\n [channelDefaultCurrencyCode]=\"channelDefaultCurrencyCode\"\n [variant]=\"variant\"\n />\n\n <ng-container *ngIf=\"unusedCurrencyCodes$ | async as unusedCurrencyCodes\">\n <div *ngIf=\"unusedCurrencyCodes.length\">\n <vdr-dropdown>\n <button class=\"button mt-2\" vdrDropdownTrigger>\n <clr-icon shape=\"plus\"></clr-icon>\n {{ 'catalog.add-price-in-another-currency' | translate }}\n <clr-icon shape=\"ellipsis-vertical\"></clr-icon>\n </button>\n <vdr-dropdown-menu>\n <button\n vdrDropdownItem\n *ngFor=\"let currencyCode of unusedCurrencyCodes\"\n (click)=\"addPriceInCurrency(currencyCode)\"\n >\n {{ currencyCode | localeCurrencyName }}\n </button>\n </vdr-dropdown-menu>\n </vdr-dropdown>\n </div>\n </ng-container>\n </vdr-card>\n <vdr-card [title]=\"'catalog.stock-levels' | translate\">\n <div class=\"form-grid\">\n <vdr-form-field\n for=\"track-inventory\"\n [label]=\"'catalog.track-inventory' | translate\"\n [tooltip]=\"'catalog.track-inventory-tooltip' | translate\"\n >\n <select\n name=\"track-inventory\"\n formControlName=\"trackInventory\"\n [disabled]=\"!(updatePermissions | hasPermission)\"\n >\n <option [value]=\"GlobalFlag.TRUE\">\n {{ 'catalog.track-inventory-true' | translate }}\n </option>\n <option [value]=\"GlobalFlag.FALSE\">\n {{ 'catalog.track-inventory-false' | translate }}\n </option>\n <option [value]=\"GlobalFlag.INHERIT\">\n {{ 'catalog.track-inventory-inherit' | translate }}\n </option>\n </select>\n </vdr-form-field>\n\n <vdr-form-item\n [label]=\"'catalog.out-of-stock-threshold' | translate\"\n [tooltip]=\"'catalog.out-of-stock-threshold-tooltip' | translate\"\n >\n <input\n type=\"number\"\n formControlName=\"outOfStockThreshold\"\n [readonly]=\"!(updatePermissions | hasPermission)\"\n [vdrDisabled]=\"\n detailForm.get('useGlobalOutOfStockThreshold')?.value !== false ||\n inventoryIsNotTracked(detailForm)\n \"\n />\n <clr-toggle-wrapper>\n <input\n type=\"checkbox\"\n clrToggle\n name=\"useGlobalOutOfStockThreshold\"\n formControlName=\"useGlobalOutOfStockThreshold\"\n [vdrDisabled]=\"\n !(updatePermissions | hasPermission) || inventoryIsNotTracked(detailForm)\n \"\n />\n <label\n >{{ 'catalog.use-global-value' | translate }} ({{\n globalOutOfStockThreshold\n }})</label\n >\n </clr-toggle-wrapper>\n </vdr-form-item>\n </div>\n <div\n class=\"form-grid stock-levels\"\n *ngFor=\"let stockLevel of stockLevelsForm.controls\"\n [formGroup]=\"stockLevel\"\n >\n <vdr-form-field\n [label]=\"\n stockLevel.get('stockLocationName')?.value +\n ': ' +\n ('catalog.stock-on-hand' | translate)\n \"\n [for]=\"'stockOnHand_' + stockLevel.get('stockLocationId')?.value\"\n >\n <input\n [id]=\"'stockOnHand_' + stockLevel.get('stockLocationId')?.value\"\n type=\"number\"\n formControlName=\"stockOnHand\"\n [readonly]=\"!(updatePermissions | hasPermission)\"\n />\n </vdr-form-field>\n <vdr-form-item\n [label]=\"\n stockLevel.get('stockLocationName')?.value +\n ': ' +\n ('catalog.stock-allocated' | translate)\n \"\n >\n {{ stockLevel.get('stockAllocated')?.value }}\n </vdr-form-item>\n </div>\n <ng-container *ngIf=\"unusedStockLocation$ | async as unusedStockLocations\">\n <div *ngIf=\"unusedStockLocations.length\">\n <vdr-dropdown>\n <button class=\"button mt-2\" vdrDropdownTrigger>\n <clr-icon shape=\"plus\"></clr-icon>\n {{ 'catalog.add-stock-location' | translate }}\n <clr-icon shape=\"ellipsis-vertical\"></clr-icon>\n </button>\n <vdr-dropdown-menu>\n <button\n vdrDropdownItem\n *ngFor=\"let stockLocation of unusedStockLocations\"\n (click)=\"addStockLocation(stockLocation)\"\n >\n <clr-icon shape=\"map-marker\"></clr-icon> {{ stockLocation.name }}\n </button>\n </vdr-dropdown-menu>\n </vdr-dropdown>\n </div>\n </ng-container>\n </vdr-card>\n </vdr-page-block>\n </vdr-page-detail-layout>\n</form>\n", styles: [".facets,.options{display:flex;flex-wrap:wrap;gap:3px}vdr-product-variant-quick-jump{flex:1;margin-inline-end:calc(var(--space-unit) * 2)}.stock-levels,.prices{margin-top:calc(var(--space-unit) * 2);padding-top:calc(var(--space-unit) * 2);border-top:1px solid var(--color-weight-150)}.price-wrapper{display:flex;align-items:center;gap:var(--space-unit);width:100%}.price-wrapper.pending-deletion vdr-currency-input{opacity:.7}.price-wrapper.pending-deletion .delete-button{background-color:var(--color-error-700);color:var(--color-error-100)}.title-row{display:flex;justify-content:space-between;align-items:center}.title{font-size:var(--font-size-base)}\n"], dependencies: [{ kind: "directive", type: i3.ClrIconCustomTag, selector: "clr-icon" }, { kind: "directive", type: i3.ClrLabel, selector: "label", inputs: ["id", "for"] }, { kind: "directive", type: i3.ClrCheckbox, selector: "[clrCheckbox],[clrToggle]" }, { kind: "component", type: i3.ClrCheckboxWrapper, selector: "clr-checkbox-wrapper,clr-toggle-wrapper" }, { kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i2.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i1.ActionBarComponent, selector: "vdr-action-bar" }, { kind: "component", type: i1.ActionBarLeftComponent, selector: "vdr-ab-left", inputs: ["grow"] }, { kind: "component", type: i1.ActionBarRightComponent, selector: "vdr-ab-right", inputs: ["grow"] }, { kind: "component", type: i1.ActionBarDropdownMenuComponent, selector: "vdr-action-bar-dropdown-menu", inputs: ["alwaysShow"] }, { kind: "component", type: i1.AssetsComponent, selector: "vdr-assets", inputs: ["assets", "featuredAsset", "compact", "updatePermissions", "multiSelect"], outputs: ["change"] }, { kind: "component", type: i1.ChipComponent, selector: "vdr-chip", inputs: ["icon", "invert", "colorFrom", "colorType"], outputs: ["iconClick"] }, { kind: "component", type: i1.CurrencyInputComponent, selector: "vdr-currency-input", inputs: ["disabled", "readonly", "value", "currencyCode"], outputs: ["valueChange"] }, { kind: "component", type: i1.FacetValueChipComponent, selector: "vdr-facet-value-chip", inputs: ["facetValue", "removable", "displayFacetName"], outputs: ["remove"] }, { kind: "component", type: i1.FormFieldComponent, selector: "vdr-form-field", inputs: ["label", "for", "tooltip", "errors", "readOnlyToggle"], outputs: ["readOnlyToggleChange"] }, { kind: "directive", type: i1.FormFieldControlDirective, selector: "input, textarea, select, vdr-currency-input" }, { kind: "component", type: i1.FormItemComponent, selector: "vdr-form-item", inputs: ["label", "tooltip"] }, { kind: "component", type: i1.LanguageSelectorComponent, selector: "vdr-language-selector", inputs: ["currentLanguageCode", "availableLanguageCodes", "disabled"], outputs: ["languageCodeChange"] }, { kind: "component", type: i1.DropdownComponent, selector: "vdr-dropdown", inputs: ["manualToggle"] }, { kind: "component", type: i1.DropdownMenuComponent, selector: "vdr-dropdown-menu", inputs: ["vdrPosition", "customClasses"] }, { kind: "directive", type: i1.DropdownTriggerDirective, selector: "[vdrDropdownTrigger]" }, { kind: "directive", type: i1.DropdownItemDirective, selector: "[vdrDropdownItem]" }, { kind: "directive", type: i1.IfPermissionsDirective, selector: "[vdrIfPermissions]", inputs: ["vdrIfPermissions", "vdrIfPermissionsElse"] }, { kind: "component", type: i1.ActionBarItemsComponent, selector: "vdr-action-bar-items" }, { kind: "directive", type: i1.DisabledDirective, selector: "[vdrDisabled]", inputs: ["vdrDisabled"] }, { kind: "component", type: i1.TabbedCustomFieldsComponent, selector: "vdr-tabbed-custom-fields", inputs: ["entityName", "customFields", "customFieldsFormGroup", "readonly", "compact", "showLabel"] }, { kind: "component", type: i1.CustomDetailComponentHostComponent, selector: "vdr-custom-detail-component-host", inputs: ["locationId", "entity$", "detailForm"] }, { kind: "component", type: i1.PageBlockComponent, selector: "vdr-page-block" }, { kind: "component", type: i1.PageEntityInfoComponent, selector: "vdr-page-entity-info", inputs: ["entity"] }, { kind: "component", type: i1.PageDetailLayoutComponent, selector: "vdr-page-detail-layout" }, { kind: "component", type: i1.PageDetailSidebarComponent, selector: "vdr-page-detail-sidebar" }, { kind: "component", type: i1.CardComponent, selector: "vdr-card", inputs: ["title", "paddingX"] }, { kind: "component", type: VariantPriceDetailComponent, selector: "vdr-variant-price-detail", inputs: ["priceIncludesTax", "price", "currencyCode", "taxCategoryId"] }, { kind: "component", type: VariantPriceStrategyDetailComponent, selector: "vdr-variant-price-strategy-detail", inputs: ["channelPriceIncludesTax", "variant", "channelDefaultCurrencyCode"] }, { kind: "component", type: ProductVariantQuickJumpComponent, selector: "vdr-product-variant-quick-jump", inputs: ["productId"] }, { kind: "pipe", type: i3$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }, { kind: "pipe", type: i1.LocaleCurrencyNamePipe, name: "localeCurrencyName" }, { kind: "pipe", type: i1.SortPipe, name: "sort" }, { kind: "pipe", type: i1.HasPermissionPipe, name: "hasPermission" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
4437
4437
|
}
|
|
4438
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
4438
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ProductVariantDetailComponent, decorators: [{
|
|
4439
4439
|
type: Component,
|
|
4440
4440
|
args: [{ selector: 'vdr-product-variant-detail', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<vdr-page-block>\n <vdr-action-bar>\n <vdr-ab-left [grow]=\"true\">\n <div class=\"flex center\">\n <ng-container *ngIf=\"availableLanguages$ | async as availableLanguages\">\n <vdr-language-selector\n *ngIf=\"availableLanguages.length > 1\"\n class=\"mr-2\"\n [disabled]=\"isNew$ | async\"\n [availableLanguageCodes]=\"availableLanguages\"\n [currentLanguageCode]=\"languageCode$ | async\"\n (languageCodeChange)=\"setLanguage($event)\"\n ></vdr-language-selector>\n </ng-container>\n <vdr-product-variant-quick-jump [productId]=\"entity?.product.id\" />\n </div>\n </vdr-ab-left>\n\n <vdr-ab-right>\n <vdr-action-bar-items locationId=\"product-variant-detail\"></vdr-action-bar-items>\n <button\n *vdrIfPermissions=\"['UpdateCatalog', 'UpdateProduct']\"\n class=\"btn btn-primary\"\n (click)=\"save()\"\n [disabled]=\"\n (detailForm.invalid ||\n stockLevelsForm.invalid ||\n pricesForm.invalid ||\n (detailForm.pristine && stockLevelsForm.pristine && pricesForm.pristine)) &&\n !assetsChanged()\n \"\n >\n {{ 'common.update' | translate }}\n </button>\n <vdr-action-bar-dropdown-menu locationId=\"product-variant-detail\"></vdr-action-bar-dropdown-menu>\n </vdr-ab-right>\n </vdr-action-bar>\n</vdr-page-block>\n<form class=\"form\" [formGroup]=\"detailForm\" *ngIf=\"entity$ | async as variant\">\n <vdr-page-detail-layout>\n <vdr-page-detail-sidebar\n ><vdr-card>\n <vdr-form-field [label]=\"'catalog.visibility' | translate\" for=\"visibility\">\n <clr-toggle-wrapper *vdrIfPermissions=\"['UpdateCatalog', 'UpdateProduct']\">\n <input\n type=\"checkbox\"\n clrToggle\n name=\"enabled\"\n [formControl]=\"detailForm.get(['enabled'])\"\n />\n <label>{{ 'common.enabled' | translate }}</label>\n </clr-toggle-wrapper>\n </vdr-form-field>\n </vdr-card>\n <vdr-card *ngIf=\"variant.options.length\" [title]=\"'catalog.product-options' | translate\">\n <div class=\"options\">\n <vdr-chip\n *ngFor=\"let option of variant.options | sort : 'groupId'\"\n [colorFrom]=\"optionGroupCode(option.groupId)\"\n [invert]=\"true\"\n >\n <span>{{ optionGroupCode(option.groupId) }}:</span>\n {{ optionName(option) }}\n </vdr-chip>\n </div>\n <div>\n <a\n [routerLink]=\"['../../', 'options']\"\n class=\"button-small mt-2\"\n *vdrIfPermissions=\"updatePermissions\"\n >\n <clr-icon shape=\"pencil\"></clr-icon>\n {{ 'catalog.edit-options' | translate }}\n </a>\n </div>\n </vdr-card>\n <vdr-card [title]=\"'catalog.facets' | translate\">\n <div class=\"facets\">\n <vdr-facet-value-chip\n *ngFor=\"let facetValue of facetValues$ | async\"\n [facetValue]=\"facetValue\"\n [removable]=\"updatePermissions | hasPermission\"\n (remove)=\"removeFacetValue(facetValue.id)\"\n ></vdr-facet-value-chip>\n </div>\n <div>\n <button\n class=\"button-small mt-2\"\n *vdrIfPermissions=\"updatePermissions\"\n (click)=\"selectFacetValue()\"\n >\n <clr-icon shape=\"plus\"></clr-icon>\n {{ 'catalog.add-facets' | translate }}\n </button>\n </div>\n </vdr-card>\n\n <vdr-card>\n <vdr-page-entity-info *ngIf=\"entity$ | async as entity\" [entity]=\"entity\" />\n </vdr-card>\n </vdr-page-detail-sidebar>\n\n <vdr-page-block>\n <button type=\"submit\" hidden x-data=\"prevents enter key from triggering other buttons\"></button>\n <vdr-card>\n <div class=\"form-grid\">\n <vdr-form-field [label]=\"'common.name' | translate\" for=\"name\">\n <input\n id=\"name\"\n type=\"text\"\n formControlName=\"name\"\n [readonly]=\"!(['UpdateCatalog', 'UpdateProduct'] | hasPermission)\"\n />\n </vdr-form-field>\n <vdr-form-field [label]=\"'catalog.sku' | translate\" for=\"sku\">\n <input\n id=\"sku\"\n type=\"text\"\n formControlName=\"sku\"\n [readonly]=\"!(updatePermissions | hasPermission)\"\n />\n </vdr-form-field>\n </div>\n </vdr-card>\n <vdr-card [title]=\"'common.custom-fields' | translate\" *ngIf=\"customFields.length\">\n <vdr-tabbed-custom-fields\n entityName=\"ProductVariant\"\n [customFields]=\"customFields\"\n [customFieldsFormGroup]=\"detailForm.get('customFields')\"\n [readonly]=\"!(updatePermissions | hasPermission)\"\n />\n </vdr-card>\n <vdr-custom-detail-component-host\n locationId=\"product-variant-detail\"\n [entity$]=\"entity$\"\n [detailForm]=\"detailForm\"\n />\n <vdr-card [title]=\"'catalog.assets' | translate\">\n <vdr-assets\n [assets]=\"assetChanges.assets || variant.assets\"\n [featuredAsset]=\"assetChanges.featuredAsset || variant.featuredAsset\"\n [updatePermissions]=\"updatePermissions\"\n (change)=\"assetChanges = $event\"\n />\n </vdr-card>\n <vdr-card [title]=\"'catalog.price-and-tax' | translate\">\n <div class=\"form-grid\">\n <vdr-form-field [label]=\"'catalog.tax-category' | translate\" for=\"taxCategory\">\n <select name=\"taxCategory\" formControlName=\"taxCategoryId\">\n <option\n *ngFor=\"let taxCategory of taxCategories$ | async\"\n [value]=\"taxCategory.id\"\n >\n {{ taxCategory.name }}\n </option>\n </select>\n </vdr-form-field>\n </div>\n <div class=\"form-grid prices\" *ngFor=\"let price of pricesForm.controls\" [formGroup]=\"price\">\n <vdr-form-field\n [label]=\"\n ('catalog.price' | translate) +\n (1 < pricesForm.length ? ' (' + price.value.currencyCode + ')' : '')\n \"\n [tooltip]=\"\n 1 < pricesForm.length && price.value.currencyCode === channelDefaultCurrencyCode\n ? ('catalog.default-currency' | translate)\n : undefined\n \"\n for=\"price\"\n >\n <div class=\"price-wrapper\" [class.pending-deletion]=\"price.value.delete === true\">\n <vdr-currency-input\n name=\"price\"\n [currencyCode]=\"price.value.currencyCode\"\n [readonly]=\"\n !(updatePermissions | hasPermission) || price.value.delete === true\n \"\n formControlName=\"price\"\n />\n <div *ngIf=\"1 < pricesForm.controls.length\">\n <button\n class=\"button-small delete-button\"\n [disabled]=\"price.value.currencyCode === channelDefaultCurrencyCode\"\n (click)=\"toggleDeletePrice(price.get('delete'))\"\n >\n <clr-icon shape=\"trash\"></clr-icon>\n </button>\n </div>\n </div>\n </vdr-form-field>\n <vdr-variant-price-detail\n [price]=\"price.value.price\"\n [currencyCode]=\"price.value.currencyCode\"\n [priceIncludesTax]=\"channelPriceIncludesTax$ | async\"\n [taxCategoryId]=\"detailForm.get('taxCategoryId')!.value\"\n />\n\n <div class=\"form-grid-span\" *ngIf=\"customPriceFields.length\">\n <div class=\"title-row\">\n <span class=\"title\">{{ 'common.custom-fields' | translate }}</span>\n </div>\n <vdr-tabbed-custom-fields\n entityName=\"ProductVariantPrice\"\n [customFields]=\"customPriceFields\"\n [customFieldsFormGroup]=\"price.get(['customFields'])\"\n [readonly]=\"!(updatePermissions | hasPermission)\"\n />\n </div>\n </div>\n\n <vdr-variant-price-strategy-detail\n [channelPriceIncludesTax]=\"channelPriceIncludesTax$ | async\"\n [channelDefaultCurrencyCode]=\"channelDefaultCurrencyCode\"\n [variant]=\"variant\"\n />\n\n <ng-container *ngIf=\"unusedCurrencyCodes$ | async as unusedCurrencyCodes\">\n <div *ngIf=\"unusedCurrencyCodes.length\">\n <vdr-dropdown>\n <button class=\"button mt-2\" vdrDropdownTrigger>\n <clr-icon shape=\"plus\"></clr-icon>\n {{ 'catalog.add-price-in-another-currency' | translate }}\n <clr-icon shape=\"ellipsis-vertical\"></clr-icon>\n </button>\n <vdr-dropdown-menu>\n <button\n vdrDropdownItem\n *ngFor=\"let currencyCode of unusedCurrencyCodes\"\n (click)=\"addPriceInCurrency(currencyCode)\"\n >\n {{ currencyCode | localeCurrencyName }}\n </button>\n </vdr-dropdown-menu>\n </vdr-dropdown>\n </div>\n </ng-container>\n </vdr-card>\n <vdr-card [title]=\"'catalog.stock-levels' | translate\">\n <div class=\"form-grid\">\n <vdr-form-field\n for=\"track-inventory\"\n [label]=\"'catalog.track-inventory' | translate\"\n [tooltip]=\"'catalog.track-inventory-tooltip' | translate\"\n >\n <select\n name=\"track-inventory\"\n formControlName=\"trackInventory\"\n [disabled]=\"!(updatePermissions | hasPermission)\"\n >\n <option [value]=\"GlobalFlag.TRUE\">\n {{ 'catalog.track-inventory-true' | translate }}\n </option>\n <option [value]=\"GlobalFlag.FALSE\">\n {{ 'catalog.track-inventory-false' | translate }}\n </option>\n <option [value]=\"GlobalFlag.INHERIT\">\n {{ 'catalog.track-inventory-inherit' | translate }}\n </option>\n </select>\n </vdr-form-field>\n\n <vdr-form-item\n [label]=\"'catalog.out-of-stock-threshold' | translate\"\n [tooltip]=\"'catalog.out-of-stock-threshold-tooltip' | translate\"\n >\n <input\n type=\"number\"\n formControlName=\"outOfStockThreshold\"\n [readonly]=\"!(updatePermissions | hasPermission)\"\n [vdrDisabled]=\"\n detailForm.get('useGlobalOutOfStockThreshold')?.value !== false ||\n inventoryIsNotTracked(detailForm)\n \"\n />\n <clr-toggle-wrapper>\n <input\n type=\"checkbox\"\n clrToggle\n name=\"useGlobalOutOfStockThreshold\"\n formControlName=\"useGlobalOutOfStockThreshold\"\n [vdrDisabled]=\"\n !(updatePermissions | hasPermission) || inventoryIsNotTracked(detailForm)\n \"\n />\n <label\n >{{ 'catalog.use-global-value' | translate }} ({{\n globalOutOfStockThreshold\n }})</label\n >\n </clr-toggle-wrapper>\n </vdr-form-item>\n </div>\n <div\n class=\"form-grid stock-levels\"\n *ngFor=\"let stockLevel of stockLevelsForm.controls\"\n [formGroup]=\"stockLevel\"\n >\n <vdr-form-field\n [label]=\"\n stockLevel.get('stockLocationName')?.value +\n ': ' +\n ('catalog.stock-on-hand' | translate)\n \"\n [for]=\"'stockOnHand_' + stockLevel.get('stockLocationId')?.value\"\n >\n <input\n [id]=\"'stockOnHand_' + stockLevel.get('stockLocationId')?.value\"\n type=\"number\"\n formControlName=\"stockOnHand\"\n [readonly]=\"!(updatePermissions | hasPermission)\"\n />\n </vdr-form-field>\n <vdr-form-item\n [label]=\"\n stockLevel.get('stockLocationName')?.value +\n ': ' +\n ('catalog.stock-allocated' | translate)\n \"\n >\n {{ stockLevel.get('stockAllocated')?.value }}\n </vdr-form-item>\n </div>\n <ng-container *ngIf=\"unusedStockLocation$ | async as unusedStockLocations\">\n <div *ngIf=\"unusedStockLocations.length\">\n <vdr-dropdown>\n <button class=\"button mt-2\" vdrDropdownTrigger>\n <clr-icon shape=\"plus\"></clr-icon>\n {{ 'catalog.add-stock-location' | translate }}\n <clr-icon shape=\"ellipsis-vertical\"></clr-icon>\n </button>\n <vdr-dropdown-menu>\n <button\n vdrDropdownItem\n *ngFor=\"let stockLocation of unusedStockLocations\"\n (click)=\"addStockLocation(stockLocation)\"\n >\n <clr-icon shape=\"map-marker\"></clr-icon> {{ stockLocation.name }}\n </button>\n </vdr-dropdown-menu>\n </vdr-dropdown>\n </div>\n </ng-container>\n </vdr-card>\n </vdr-page-block>\n </vdr-page-detail-layout>\n</form>\n", styles: [".facets,.options{display:flex;flex-wrap:wrap;gap:3px}vdr-product-variant-quick-jump{flex:1;margin-inline-end:calc(var(--space-unit) * 2)}.stock-levels,.prices{margin-top:calc(var(--space-unit) * 2);padding-top:calc(var(--space-unit) * 2);border-top:1px solid var(--color-weight-150)}.price-wrapper{display:flex;align-items:center;gap:var(--space-unit);width:100%}.price-wrapper.pending-deletion vdr-currency-input{opacity:.7}.price-wrapper.pending-deletion .delete-button{background-color:var(--color-error-700);color:var(--color-error-100)}.title-row{display:flex;justify-content:space-between;align-items:center}.title{font-size:var(--font-size-base)}\n"] }]
|
|
4441
4441
|
}], ctorParameters: () => [{ type: ProductDetailService }, { type: i2.FormBuilder }, { type: i1.ModalService }, { type: i1.NotificationService }, { type: i1.DataService }, { type: i0.ChangeDetectorRef }] });
|
|
@@ -4597,10 +4597,10 @@ class ProductVariantsTableComponent {
|
|
|
4597
4597
|
}
|
|
4598
4598
|
this.changeDetector.markForCheck();
|
|
4599
4599
|
}
|
|
4600
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
4601
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
4600
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ProductVariantsTableComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4601
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: ProductVariantsTableComponent, isStandalone: false, selector: "vdr-product-variants-table", inputs: { formArray: ["productVariantsFormArray", "formArray"], variants: "variants", paginationConfig: "paginationConfig", channelPriceIncludesTax: "channelPriceIncludesTax", optionGroups: "optionGroups", pendingAssetChanges: "pendingAssetChanges" }, ngImport: i0, template: "<table class=\"table\">\n <thead>\n <tr>\n <th></th>\n <th>{{ 'common.name' | translate }}</th>\n <th>{{ 'catalog.sku' | translate }}</th>\n <ng-container *ngFor=\"let optionGroup of optionGroups | sort: 'id'\">\n <th>{{ optionGroup.name }}</th>\n </ng-container>\n <th>{{ 'catalog.price' | translate }}</th>\n <th>{{ 'catalog.stock-on-hand' | translate }}</th>\n <th>{{ 'common.enabled' | translate }}</th>\n </tr>\n </thead>\n <tbody>\n <tr *ngFor=\"let variant of variants | paginate: paginationConfig; index as i; trackBy: trackByFn\">\n <ng-container *ngIf=\"formGroupMap.get(variant.id) as formGroup\" [formGroup]=\"formGroup\">\n <td class=\"left align-middle\" [class.disabled]=\"!formGroup.get('enabled')!.value\">\n <div class=\"card-img\">\n <div class=\"featured-asset\">\n <img\n *ngIf=\"getFeaturedAsset(variant) as featuredAsset; else placeholder\"\n [src]=\"featuredAsset | assetPreview: 'tiny'\"\n />\n <ng-template #placeholder>\n <div class=\"placeholder\">\n <clr-icon shape=\"image\" size=\"48\"></clr-icon>\n </div>\n </ng-template>\n </div>\n </div>\n </td>\n <td class=\"left align-middle\" [class.disabled]=\"!formGroup.get('enabled')!.value\">\n <clr-input-container>\n <input\n clrInput\n type=\"text\"\n formControlName=\"name\"\n [readonly]=\"!(updatePermission | hasPermission)\"\n [placeholder]=\"'common.name' | translate\"\n />\n </clr-input-container>\n </td>\n <td class=\"left align-middle\" [class.disabled]=\"!formGroup.get('enabled')!.value\">\n <clr-input-container>\n <input\n clrInput\n type=\"text\"\n formControlName=\"sku\"\n [readonly]=\"!(updatePermission | hasPermission)\"\n [placeholder]=\"'catalog.sku' | translate\"\n />\n </clr-input-container>\n </td>\n <ng-container *ngFor=\"let option of variant.options | sort: 'groupId'\">\n <td\n class=\"left align-middle\"\n [class.disabled]=\"!formGroup.get('enabled')!.value\"\n [style.color]=\"optionGroupName(option.groupId) | stringToColor\"\n >\n {{ option.name }}\n </td>\n </ng-container>\n <td class=\"left align-middle price\" [class.disabled]=\"!formGroup.get('enabled')!.value\">\n <clr-input-container>\n <vdr-currency-input\n *ngIf=\"!channelPriceIncludesTax\"\n clrInput\n [currencyCode]=\"variant.currencyCode\"\n [readonly]=\"!(updatePermission | hasPermission)\"\n formControlName=\"price\"\n ></vdr-currency-input>\n <vdr-currency-input\n *ngIf=\"channelPriceIncludesTax\"\n clrInput\n [currencyCode]=\"variant.currencyCode\"\n [readonly]=\"!(updatePermission | hasPermission)\"\n formControlName=\"priceWithTax\"\n ></vdr-currency-input>\n </clr-input-container>\n </td>\n <td class=\"left align-middle stock\" [class.disabled]=\"!formGroup.get('enabled')!.value\">\n <clr-input-container>\n <input\n clrInput\n type=\"number\"\n min=\"0\"\n step=\"1\"\n formControlName=\"stockOnHand\"\n [readonly]=\"!(updatePermission | hasPermission)\"\n />\n </clr-input-container>\n </td>\n <td class=\"left align-middle stock\" [class.disabled]=\"!formGroup.get('enabled')!.value\">\n <clr-toggle-wrapper>\n <input\n type=\"checkbox\"\n clrToggle\n name=\"enabled\"\n formControlName=\"enabled\"\n [vdrDisabled]=\"!(updatePermission | hasPermission)\"\n />\n </clr-toggle-wrapper>\n </td>\n </ng-container>\n </tr>\n </tbody>\n</table>\n", styles: [".placeholder{color:var(--color-grey-300)}.stock input,.price input{max-width:96px}td{transition:background-color .2s}td.disabled{background-color:var(--color-component-bg-200)}\n"], dependencies: [{ kind: "directive", type: i3.ClrIconCustomTag, selector: "clr-icon" }, { kind: "directive", type: i3.ClrCheckbox, selector: "[clrCheckbox],[clrToggle]" }, { kind: "component", type: i3.ClrCheckboxWrapper, selector: "clr-checkbox-wrapper,clr-toggle-wrapper" }, { kind: "directive", type: i3.ClrInput, selector: "[clrInput]" }, { kind: "component", type: i3.ClrInputContainer, selector: "clr-input-container" }, { kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { 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.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i2.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i1.CurrencyInputComponent, selector: "vdr-currency-input", inputs: ["disabled", "readonly", "value", "currencyCode"], outputs: ["valueChange"] }, { kind: "directive", type: i1.FormFieldControlDirective, selector: "input, textarea, select, vdr-currency-input" }, { kind: "directive", type: i1.DisabledDirective, selector: "[vdrDisabled]", inputs: ["vdrDisabled"] }, { kind: "pipe", type: i5$2.PaginatePipe, name: "paginate" }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }, { kind: "pipe", type: i1.SortPipe, name: "sort" }, { kind: "pipe", type: i1.StringToColorPipe, name: "stringToColor" }, { kind: "pipe", type: i1.HasPermissionPipe, name: "hasPermission" }, { kind: "pipe", type: i1.AssetPreviewPipe, name: "assetPreview" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
4602
4602
|
}
|
|
4603
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
4603
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ProductVariantsTableComponent, decorators: [{
|
|
4604
4604
|
type: Component,
|
|
4605
4605
|
args: [{ selector: 'vdr-product-variants-table', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<table class=\"table\">\n <thead>\n <tr>\n <th></th>\n <th>{{ 'common.name' | translate }}</th>\n <th>{{ 'catalog.sku' | translate }}</th>\n <ng-container *ngFor=\"let optionGroup of optionGroups | sort: 'id'\">\n <th>{{ optionGroup.name }}</th>\n </ng-container>\n <th>{{ 'catalog.price' | translate }}</th>\n <th>{{ 'catalog.stock-on-hand' | translate }}</th>\n <th>{{ 'common.enabled' | translate }}</th>\n </tr>\n </thead>\n <tbody>\n <tr *ngFor=\"let variant of variants | paginate: paginationConfig; index as i; trackBy: trackByFn\">\n <ng-container *ngIf=\"formGroupMap.get(variant.id) as formGroup\" [formGroup]=\"formGroup\">\n <td class=\"left align-middle\" [class.disabled]=\"!formGroup.get('enabled')!.value\">\n <div class=\"card-img\">\n <div class=\"featured-asset\">\n <img\n *ngIf=\"getFeaturedAsset(variant) as featuredAsset; else placeholder\"\n [src]=\"featuredAsset | assetPreview: 'tiny'\"\n />\n <ng-template #placeholder>\n <div class=\"placeholder\">\n <clr-icon shape=\"image\" size=\"48\"></clr-icon>\n </div>\n </ng-template>\n </div>\n </div>\n </td>\n <td class=\"left align-middle\" [class.disabled]=\"!formGroup.get('enabled')!.value\">\n <clr-input-container>\n <input\n clrInput\n type=\"text\"\n formControlName=\"name\"\n [readonly]=\"!(updatePermission | hasPermission)\"\n [placeholder]=\"'common.name' | translate\"\n />\n </clr-input-container>\n </td>\n <td class=\"left align-middle\" [class.disabled]=\"!formGroup.get('enabled')!.value\">\n <clr-input-container>\n <input\n clrInput\n type=\"text\"\n formControlName=\"sku\"\n [readonly]=\"!(updatePermission | hasPermission)\"\n [placeholder]=\"'catalog.sku' | translate\"\n />\n </clr-input-container>\n </td>\n <ng-container *ngFor=\"let option of variant.options | sort: 'groupId'\">\n <td\n class=\"left align-middle\"\n [class.disabled]=\"!formGroup.get('enabled')!.value\"\n [style.color]=\"optionGroupName(option.groupId) | stringToColor\"\n >\n {{ option.name }}\n </td>\n </ng-container>\n <td class=\"left align-middle price\" [class.disabled]=\"!formGroup.get('enabled')!.value\">\n <clr-input-container>\n <vdr-currency-input\n *ngIf=\"!channelPriceIncludesTax\"\n clrInput\n [currencyCode]=\"variant.currencyCode\"\n [readonly]=\"!(updatePermission | hasPermission)\"\n formControlName=\"price\"\n ></vdr-currency-input>\n <vdr-currency-input\n *ngIf=\"channelPriceIncludesTax\"\n clrInput\n [currencyCode]=\"variant.currencyCode\"\n [readonly]=\"!(updatePermission | hasPermission)\"\n formControlName=\"priceWithTax\"\n ></vdr-currency-input>\n </clr-input-container>\n </td>\n <td class=\"left align-middle stock\" [class.disabled]=\"!formGroup.get('enabled')!.value\">\n <clr-input-container>\n <input\n clrInput\n type=\"number\"\n min=\"0\"\n step=\"1\"\n formControlName=\"stockOnHand\"\n [readonly]=\"!(updatePermission | hasPermission)\"\n />\n </clr-input-container>\n </td>\n <td class=\"left align-middle stock\" [class.disabled]=\"!formGroup.get('enabled')!.value\">\n <clr-toggle-wrapper>\n <input\n type=\"checkbox\"\n clrToggle\n name=\"enabled\"\n formControlName=\"enabled\"\n [vdrDisabled]=\"!(updatePermission | hasPermission)\"\n />\n </clr-toggle-wrapper>\n </td>\n </ng-container>\n </tr>\n </tbody>\n</table>\n", styles: [".placeholder{color:var(--color-grey-300)}.stock input,.price input{max-width:96px}td{transition:background-color .2s}td.disabled{background-color:var(--color-component-bg-200)}\n"] }]
|
|
4606
4606
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { formArray: [{
|
|
@@ -4664,10 +4664,10 @@ class UpdateProductOptionDialogComponent {
|
|
|
4664
4664
|
this.code = normalizeString(nameValue, '-');
|
|
4665
4665
|
}
|
|
4666
4666
|
}
|
|
4667
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
4668
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
4667
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: UpdateProductOptionDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4668
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: UpdateProductOptionDialogComponent, isStandalone: false, selector: "vdr-update-product-option-dialog", ngImport: i0, template: "<ng-template vdrDialogTitle>{{ 'catalog.update-product-option' | translate }}</ng-template>\n<vdr-form-field [label]=\"'catalog.option-name' | translate\" for=\"name\">\n <input\n id=\"name\"\n type=\"text\"\n #nameInput=\"ngModel\"\n [(ngModel)]=\"name\"\n required\n (input)=\"updateCode($event.target.value)\"\n />\n</vdr-form-field>\n<vdr-form-field [label]=\"'common.code' | translate\" for=\"code\">\n <input id=\"code\" type=\"text\" #codeInput=\"ngModel\" required [(ngModel)]=\"code\" pattern=\"[a-z0-9_-]+\" />\n</vdr-form-field>\n<clr-checkbox-wrapper>\n <input type=\"checkbox\" clrCheckbox [(ngModel)]=\"updateVariantName\" />\n <label>{{ 'catalog.auto-update-option-variant-name' | translate }}</label>\n</clr-checkbox-wrapper>\n<section *ngIf=\"customFields.length\">\n <label>{{ 'common.custom-fields' | translate }}</label>\n <vdr-tabbed-custom-fields\n entityName=\"ProductOption\"\n [customFields]=\"customFields\"\n [customFieldsFormGroup]=\"customFieldsForm\"\n [readonly]=\"!(['UpdateCatalog', 'UpdateProduct'] | hasPermission)\"\n ></vdr-tabbed-custom-fields>\n</section>\n\n<ng-template vdrDialogButtons>\n <button type=\"button\" class=\"btn\" (click)=\"cancel()\">{{ 'common.cancel' | translate }}</button>\n <button\n type=\"submit\"\n (click)=\"update()\"\n [disabled]=\"\n nameInput.invalid ||\n codeInput.invalid ||\n (nameInput.pristine && codeInput.pristine && customFieldsForm.pristine)\n \"\n class=\"btn btn-primary\"\n >\n {{ 'catalog.update-product-option' | translate }}\n </button>\n</ng-template>\n", styles: [""], dependencies: [{ kind: "directive", type: i3.ClrLabel, selector: "label", inputs: ["id", "for"] }, { kind: "directive", type: i3.ClrCheckbox, selector: "[clrCheckbox],[clrToggle]" }, { kind: "component", type: i3.ClrCheckboxWrapper, selector: "clr-checkbox-wrapper,clr-toggle-wrapper" }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { 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.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { 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.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: "component", type: i1.FormFieldComponent, selector: "vdr-form-field", inputs: ["label", "for", "tooltip", "errors", "readOnlyToggle"], outputs: ["readOnlyToggleChange"] }, { kind: "directive", type: i1.FormFieldControlDirective, selector: "input, textarea, select, vdr-currency-input" }, { kind: "directive", type: i1.DialogButtonsDirective, selector: "[vdrDialogButtons]" }, { kind: "directive", type: i1.DialogTitleDirective, selector: "[vdrDialogTitle]" }, { kind: "component", type: i1.TabbedCustomFieldsComponent, selector: "vdr-tabbed-custom-fields", inputs: ["entityName", "customFields", "customFieldsFormGroup", "readonly", "compact", "showLabel"] }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }, { kind: "pipe", type: i1.HasPermissionPipe, name: "hasPermission" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
4669
4669
|
}
|
|
4670
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
4670
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: UpdateProductOptionDialogComponent, decorators: [{
|
|
4671
4671
|
type: Component,
|
|
4672
4672
|
args: [{ selector: 'vdr-update-product-option-dialog', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<ng-template vdrDialogTitle>{{ 'catalog.update-product-option' | translate }}</ng-template>\n<vdr-form-field [label]=\"'catalog.option-name' | translate\" for=\"name\">\n <input\n id=\"name\"\n type=\"text\"\n #nameInput=\"ngModel\"\n [(ngModel)]=\"name\"\n required\n (input)=\"updateCode($event.target.value)\"\n />\n</vdr-form-field>\n<vdr-form-field [label]=\"'common.code' | translate\" for=\"code\">\n <input id=\"code\" type=\"text\" #codeInput=\"ngModel\" required [(ngModel)]=\"code\" pattern=\"[a-z0-9_-]+\" />\n</vdr-form-field>\n<clr-checkbox-wrapper>\n <input type=\"checkbox\" clrCheckbox [(ngModel)]=\"updateVariantName\" />\n <label>{{ 'catalog.auto-update-option-variant-name' | translate }}</label>\n</clr-checkbox-wrapper>\n<section *ngIf=\"customFields.length\">\n <label>{{ 'common.custom-fields' | translate }}</label>\n <vdr-tabbed-custom-fields\n entityName=\"ProductOption\"\n [customFields]=\"customFields\"\n [customFieldsFormGroup]=\"customFieldsForm\"\n [readonly]=\"!(['UpdateCatalog', 'UpdateProduct'] | hasPermission)\"\n ></vdr-tabbed-custom-fields>\n</section>\n\n<ng-template vdrDialogButtons>\n <button type=\"button\" class=\"btn\" (click)=\"cancel()\">{{ 'common.cancel' | translate }}</button>\n <button\n type=\"submit\"\n (click)=\"update()\"\n [disabled]=\"\n nameInput.invalid ||\n codeInput.invalid ||\n (nameInput.pristine && codeInput.pristine && customFieldsForm.pristine)\n \"\n class=\"btn btn-primary\"\n >\n {{ 'catalog.update-product-option' | translate }}\n </button>\n</ng-template>\n" }]
|
|
4673
4673
|
}] });
|
|
@@ -4866,8 +4866,8 @@ class CatalogModule {
|
|
|
4866
4866
|
});
|
|
4867
4867
|
CatalogModule.hasRegisteredTabsAndBulkActions = true;
|
|
4868
4868
|
}
|
|
4869
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
4870
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.
|
|
4869
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: CatalogModule, deps: [{ token: i1.BulkActionRegistryService }, { token: i1.PageService }], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
4870
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.15", ngImport: i0, type: CatalogModule, declarations: [ProductListComponent,
|
|
4871
4871
|
ProductDetailComponent,
|
|
4872
4872
|
FacetListComponent,
|
|
4873
4873
|
FacetDetailComponent,
|
|
@@ -4932,7 +4932,7 @@ class CatalogModule {
|
|
|
4932
4932
|
CreateProductOptionGroupDialogComponent,
|
|
4933
4933
|
ProductVariantQuickJumpComponent,
|
|
4934
4934
|
CreateFacetValueDialogComponent] }); }
|
|
4935
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.
|
|
4935
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: CatalogModule, providers: [
|
|
4936
4936
|
{
|
|
4937
4937
|
provide: ROUTES,
|
|
4938
4938
|
useFactory: (pageService) => createRoutes(pageService),
|
|
@@ -4941,7 +4941,7 @@ class CatalogModule {
|
|
|
4941
4941
|
},
|
|
4942
4942
|
], imports: [SharedModule, RouterModule.forChild([])] }); }
|
|
4943
4943
|
}
|
|
4944
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
4944
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: CatalogModule, decorators: [{
|
|
4945
4945
|
type: NgModule,
|
|
4946
4946
|
args: [{
|
|
4947
4947
|
imports: [SharedModule, RouterModule.forChild([])],
|