@vendure/admin-ui 3.0.0 → 3.0.1
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/LICENSE.md +4 -3
- package/catalog/components/create-product-variant-dialog/create-product-variant-dialog.component.d.ts +3 -3
- package/core/common/version.d.ts +1 -1
- package/esm2022/catalog/components/create-product-variant-dialog/create-product-variant-dialog.component.mjs +4 -4
- package/esm2022/catalog/components/product-detail/product-detail.component.mjs +2 -2
- package/esm2022/core/common/version.mjs +2 -2
- package/esm2022/core/shared/pipes/locale-date.pipe.mjs +1 -4
- package/fesm2022/vendure-admin-ui-catalog.mjs +5 -5
- package/fesm2022/vendure-admin-ui-catalog.mjs.map +1 -1
- package/fesm2022/vendure-admin-ui-core.mjs +1 -4
- package/fesm2022/vendure-admin-ui-core.mjs.map +1 -1
- package/package.json +8 -8
- package/static/i18n-messages/pt_BR.json +8 -8
- package/static/i18n-messages/pt_PT.json +160 -160
|
@@ -504,7 +504,7 @@ class CreateProductVariantDialogComponent {
|
|
|
504
504
|
this.formBuilder = formBuilder;
|
|
505
505
|
this.form = this.formBuilder.group({
|
|
506
506
|
name: ['', Validators.required],
|
|
507
|
-
sku: [''
|
|
507
|
+
sku: [''],
|
|
508
508
|
price: [''],
|
|
509
509
|
options: this.formBuilder.record({}),
|
|
510
510
|
});
|
|
@@ -535,13 +535,13 @@ class CreateProductVariantDialogComponent {
|
|
|
535
535
|
}
|
|
536
536
|
confirm() {
|
|
537
537
|
const { name, sku, options, price } = this.form.value;
|
|
538
|
-
if (!name || !
|
|
538
|
+
if (!name || !options || price == null) {
|
|
539
539
|
return;
|
|
540
540
|
}
|
|
541
541
|
const optionIds = Object.values(options).filter(notNullOrUndefined);
|
|
542
542
|
this.resolveWith({
|
|
543
543
|
productId: this.product.id,
|
|
544
|
-
sku,
|
|
544
|
+
sku: sku || '',
|
|
545
545
|
price: Number(price),
|
|
546
546
|
optionIds,
|
|
547
547
|
translations: [
|
|
@@ -3769,11 +3769,11 @@ class ProductDetailComponent extends TypedBaseDetailComponent {
|
|
|
3769
3769
|
}
|
|
3770
3770
|
}
|
|
3771
3771
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", 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 }); }
|
|
3772
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: ProductDetailComponent, selector: "vdr-product-detail2", usesInheritance: true, ngImport: i0, template: "<vdr-page-block>\r\n <vdr-action-bar>\r\n <vdr-ab-left>\r\n <div class=\"flex clr-flex-row\"></div>\r\n <vdr-language-selector\r\n [disabled]=\"isNew$ | async\"\r\n [availableLanguageCodes]=\"availableLanguages$ | async\"\r\n [currentLanguageCode]=\"languageCode$ | async\"\r\n (languageCodeChange)=\"setLanguage($event)\"\r\n ></vdr-language-selector>\r\n </vdr-ab-left>\r\n\r\n <vdr-ab-right>\r\n <vdr-action-bar-items locationId=\"product-detail\"></vdr-action-bar-items>\r\n <button\r\n class=\"btn btn-primary\"\r\n *ngIf=\"isNew$ | async; else updateButton\"\r\n (click)=\"create()\"\r\n [disabled]=\"detailForm.invalid || detailForm.pristine || createVariantsConfig.variants.length === 0\"\r\n >\r\n {{ 'common.create' | translate }}\r\n </button>\r\n <ng-template #updateButton>\r\n <button\r\n *vdrIfPermissions=\"updatePermissions\"\r\n class=\"btn btn-primary\"\r\n (click)=\"save()\"\r\n [disabled]=\"(detailForm.invalid || detailForm.pristine) && !assetsChanged()\"\r\n >\r\n {{ 'common.update' | translate }}\r\n </button>\r\n </ng-template>\r\n <vdr-action-bar-dropdown-menu locationId=\"product-detail\"></vdr-action-bar-dropdown-menu>\r\n </vdr-ab-right>\r\n </vdr-action-bar>\r\n</vdr-page-block>\r\n\r\n<form class=\"form\" [formGroup]=\"detailForm\">\r\n <vdr-page-detail-layout>\r\n <vdr-page-detail-sidebar>\r\n <vdr-card>\r\n <vdr-form-field [label]=\"'catalog.visibility' | translate\" for=\"visibility\">\r\n <clr-toggle-wrapper *vdrIfPermissions=\"updatePermissions\">\r\n <input\r\n type=\"checkbox\"\r\n clrToggle\r\n name=\"enabled\"\r\n [formControl]=\"detailForm.get(['enabled'])\"\r\n />\r\n <label>{{ 'common.enabled' | translate }}</label>\r\n </clr-toggle-wrapper>\r\n </vdr-form-field>\r\n </vdr-card>\r\n <ng-container *ngIf=\"!(isNew$ | async)\">\r\n <vdr-card *vdrIfMultichannel [title]=\"'common.channels' | translate\">\r\n <vdr-form-item *vdrIfDefaultChannelActive>\r\n <div class=\"flex channel-assignment\">\r\n <div class=\"mb-2\">\r\n <ng-container *ngFor=\"let channel of productChannels$ | async\">\r\n <vdr-chip\r\n *ngIf=\"!isDefaultChannel(channel.code)\"\r\n icon=\"times-circle\"\r\n (iconClick)=\"removeFromChannel(channel.id)\"\r\n >\r\n <vdr-channel-badge [channelCode]=\"channel.code\"></vdr-channel-badge>\r\n {{ channel.code | channelCodeToLabel }}\r\n </vdr-chip>\r\n </ng-container>\r\n </div>\r\n <button class=\"button-small\" (click)=\"assignToChannel()\">\r\n <clr-icon shape=\"layers\"></clr-icon>\r\n {{ 'common.assign-to-channel' | translate }}\r\n </button>\r\n </div>\r\n </vdr-form-item>\r\n </vdr-card>\r\n </ng-container>\r\n <vdr-card *ngIf=\"entity?.optionGroups.length\" [title]=\"'catalog.product-options' | translate\">\r\n <div class=\"options\">\r\n <vdr-chip\r\n *ngFor=\"let optionGroup of entity?.optionGroups | sort : 'id'\"\r\n [colorFrom]=\"optionGroup.code\"\r\n [invert]=\"true\"\r\n >\r\n {{ optionGroup.name }}\r\n </vdr-chip>\r\n </div>\r\n <div>\r\n <a [routerLink]=\"['options']\" class=\"button-small mt-2\" *vdrIfPermissions=\"updatePermissions\">\r\n <clr-icon shape=\"pencil\"></clr-icon>\r\n {{ 'catalog.edit-options' | translate }}\r\n </a>\r\n </div>\r\n </vdr-card>\r\n <vdr-card [title]=\"'catalog.facets' | translate\">\r\n <div class=\"facets\">\r\n <vdr-facet-value-chip\r\n *ngFor=\"let facetValue of facetValues$ | async\"\r\n [facetValue]=\"facetValue\"\r\n [removable]=\"updatePermissions | hasPermission\"\r\n (remove)=\"removeProductFacetValue(facetValue.id)\"\r\n ></vdr-facet-value-chip>\r\n </div>\r\n <div>\r\n <button\r\n class=\"button-small mt-2\"\r\n *vdrIfPermissions=\"updatePermissions\"\r\n (click)=\"selectProductFacetValue()\"\r\n >\r\n <clr-icon shape=\"plus\"></clr-icon>\r\n {{ 'catalog.add-facets' | translate }}\r\n </button>\r\n </div>\r\n </vdr-card>\r\n <vdr-card *ngIf=\"entity$ | async as entity\">\r\n <vdr-page-entity-info [entity]=\"entity\"></vdr-page-entity-info>\r\n </vdr-card>\r\n </vdr-page-detail-sidebar>\r\n\r\n <vdr-page-block>\r\n <button type=\"submit\" hidden x-data=\"prevents enter key from triggering other buttons\"></button>\r\n <vdr-card>\r\n <div class=\"form-grid\">\r\n <div>\r\n <vdr-form-field [label]=\"'catalog.product-name' | translate\" for=\"name\">\r\n <input\r\n id=\"name\"\r\n type=\"text\"\r\n formControlName=\"name\"\r\n [readonly]=\"!(updatePermissions | hasPermission)\"\r\n (input)=\"updateSlug($event.target.value)\"\r\n />\r\n </vdr-form-field>\r\n <div *ngIf=\"(isNew$ | async) === false && detailForm.get(['name'])?.dirty\">\r\n <clr-checkbox-wrapper>\r\n <input\r\n clrCheckbox\r\n type=\"checkbox\"\r\n id=\"auto-update\"\r\n formControlName=\"autoUpdateVariantNames\"\r\n />\r\n <label>{{ 'catalog.auto-update-product-variant-name' | translate }}</label>\r\n </clr-checkbox-wrapper>\r\n </div>\r\n </div>\r\n <vdr-form-field\r\n [label]=\"'catalog.slug' | translate\"\r\n for=\"slug\"\r\n [errors]=\"{ pattern: 'catalog.slug-pattern-error' | translate }\"\r\n >\r\n <input\r\n id=\"slug\"\r\n type=\"text\"\r\n formControlName=\"slug\"\r\n [readonly]=\"!(updatePermissions | hasPermission)\"\r\n />\r\n </vdr-form-field>\r\n <vdr-form-field\r\n class=\"form-grid-span\"\r\n [label]=\"'common.description' | translate\"\r\n for=\"slug\"\r\n [errors]=\"{ pattern: 'catalog.slug-pattern-error' | translate }\"\r\n >\r\n <vdr-rich-text-editor\r\n formControlName=\"description\"\r\n [readonly]=\"!(updatePermissions | hasPermission)\"\r\n ></vdr-rich-text-editor>\r\n </vdr-form-field>\r\n </div>\r\n </vdr-card>\r\n <vdr-card [title]=\"'common.custom-fields' | translate\" *ngIf=\"customFields.length\">\r\n <vdr-tabbed-custom-fields\r\n entityName=\"Product\"\r\n [customFields]=\"customFields\"\r\n [customFieldsFormGroup]=\"detailForm.get('customFields')\"\r\n [readonly]=\"!(updatePermissions | hasPermission)\"\r\n ></vdr-tabbed-custom-fields>\r\n </vdr-card>\r\n <vdr-custom-detail-component-host\r\n locationId=\"product-detail\"\r\n [entity$]=\"entity$\"\r\n [detailForm]=\"detailForm\"\r\n ></vdr-custom-detail-component-host>\r\n <vdr-card [title]=\"'catalog.assets' | translate\">\r\n <vdr-assets\r\n [assets]=\"assetChanges.assets || entity?.assets\"\r\n [featuredAsset]=\"assetChanges.featuredAsset || entity?.featuredAsset\"\r\n [updatePermissions]=\"updatePermissions\"\r\n (change)=\"assetChanges = $event\"\r\n ></vdr-assets>\r\n </vdr-card>\r\n\r\n <vdr-card [title]=\"'catalog.product-variants' | translate\" [paddingX]=\"isNew$ | async\">\r\n <div *ngIf=\"isNew$ | async; else variantList\">\r\n <vdr-generate-product-variants\r\n (variantsChange)=\"createVariantsConfig = $event\"\r\n ></vdr-generate-product-variants>\r\n </div>\r\n <ng-template #variantList>\r\n <vdr-product-variant-list\r\n [productId]=\"this.id\"\r\n dataTableId=\"product-detail-variants-list\"\r\n [hideLanguageSelect]=\"true\"\r\n ></vdr-product-variant-list>\r\n </ng-template>\r\n <div class=\"mx-3\" *ngIf=\"(isNew$ | async) === false\">\r\n <a class=\"button\" [routerLink]=\"['manage-variants']\">\r\n <clr-icon shape=\"add-text\"></clr-icon>\r\n {{ 'catalog.manage-variants' | translate }}</a\r\n >\r\n </div>\r\n </vdr-card>\r\n </vdr-page-block>\r\n </vdr-page-detail-layout>\r\n</form>\r\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;max-height:144px}.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: ["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"], 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
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: ProductDetailComponent, selector: "vdr-product-detail2", usesInheritance: true, ngImport: i0, template: "<vdr-page-block>\r\n <vdr-action-bar>\r\n <vdr-ab-left>\r\n <div class=\"flex clr-flex-row\"></div>\r\n <vdr-language-selector\r\n [disabled]=\"isNew$ | async\"\r\n [availableLanguageCodes]=\"availableLanguages$ | async\"\r\n [currentLanguageCode]=\"languageCode$ | async\"\r\n (languageCodeChange)=\"setLanguage($event)\"\r\n ></vdr-language-selector>\r\n </vdr-ab-left>\r\n\r\n <vdr-ab-right>\r\n <vdr-action-bar-items locationId=\"product-detail\"></vdr-action-bar-items>\r\n <button\r\n class=\"btn btn-primary\"\r\n *ngIf=\"isNew$ | async; else updateButton\"\r\n (click)=\"create()\"\r\n [disabled]=\"detailForm.invalid || detailForm.pristine || createVariantsConfig.variants.length === 0\"\r\n >\r\n {{ 'common.create' | translate }}\r\n </button>\r\n <ng-template #updateButton>\r\n <button\r\n *vdrIfPermissions=\"updatePermissions\"\r\n class=\"btn btn-primary\"\r\n (click)=\"save()\"\r\n [disabled]=\"(detailForm.invalid || detailForm.pristine) && !assetsChanged()\"\r\n >\r\n {{ 'common.update' | translate }}\r\n </button>\r\n </ng-template>\r\n <vdr-action-bar-dropdown-menu locationId=\"product-detail\"></vdr-action-bar-dropdown-menu>\r\n </vdr-ab-right>\r\n </vdr-action-bar>\r\n</vdr-page-block>\r\n\r\n<form class=\"form\" [formGroup]=\"detailForm\">\r\n <vdr-page-detail-layout>\r\n <vdr-page-detail-sidebar>\r\n <vdr-card>\r\n <vdr-form-field [label]=\"'catalog.visibility' | translate\" for=\"visibility\">\r\n <clr-toggle-wrapper *vdrIfPermissions=\"updatePermissions\">\r\n <input\r\n type=\"checkbox\"\r\n clrToggle\r\n name=\"enabled\"\r\n [formControl]=\"detailForm.get(['enabled'])\"\r\n />\r\n <label>{{ 'common.enabled' | translate }}</label>\r\n </clr-toggle-wrapper>\r\n </vdr-form-field>\r\n </vdr-card>\r\n <ng-container *ngIf=\"!(isNew$ | async)\">\r\n <vdr-card *vdrIfMultichannel [title]=\"'common.channels' | translate\">\r\n <vdr-form-item *vdrIfDefaultChannelActive>\r\n <div class=\"flex channel-assignment\">\r\n <div class=\"mb-2\">\r\n <ng-container *ngFor=\"let channel of productChannels$ | async\">\r\n <vdr-chip\r\n *ngIf=\"!isDefaultChannel(channel.code)\"\r\n icon=\"times-circle\"\r\n (iconClick)=\"removeFromChannel(channel.id)\"\r\n >\r\n <vdr-channel-badge [channelCode]=\"channel.code\"></vdr-channel-badge>\r\n {{ channel.code | channelCodeToLabel }}\r\n </vdr-chip>\r\n </ng-container>\r\n </div>\r\n <button class=\"button-small\" (click)=\"assignToChannel()\">\r\n <clr-icon shape=\"layers\"></clr-icon>\r\n {{ 'common.assign-to-channel' | translate }}\r\n </button>\r\n </div>\r\n </vdr-form-item>\r\n </vdr-card>\r\n </ng-container>\r\n <vdr-card *ngIf=\"entity?.optionGroups.length\" [title]=\"'catalog.product-options' | translate\">\r\n <div class=\"options\">\r\n <vdr-chip\r\n *ngFor=\"let optionGroup of entity?.optionGroups | sort : 'id'\"\r\n [colorFrom]=\"optionGroup.code\"\r\n [invert]=\"true\"\r\n >\r\n {{ optionGroup.name }}\r\n </vdr-chip>\r\n </div>\r\n <div>\r\n <a [routerLink]=\"['options']\" class=\"button-small mt-2\" *vdrIfPermissions=\"updatePermissions\">\r\n <clr-icon shape=\"pencil\"></clr-icon>\r\n {{ 'catalog.edit-options' | translate }}\r\n </a>\r\n </div>\r\n </vdr-card>\r\n <vdr-card [title]=\"'catalog.facets' | translate\">\r\n <div class=\"facets\">\r\n <vdr-facet-value-chip\r\n *ngFor=\"let facetValue of facetValues$ | async\"\r\n [facetValue]=\"facetValue\"\r\n [removable]=\"updatePermissions | hasPermission\"\r\n (remove)=\"removeProductFacetValue(facetValue.id)\"\r\n ></vdr-facet-value-chip>\r\n </div>\r\n <div>\r\n <button\r\n class=\"button-small mt-2\"\r\n *vdrIfPermissions=\"updatePermissions\"\r\n (click)=\"selectProductFacetValue()\"\r\n >\r\n <clr-icon shape=\"plus\"></clr-icon>\r\n {{ 'catalog.add-facets' | translate }}\r\n </button>\r\n </div>\r\n </vdr-card>\r\n <vdr-card *ngIf=\"entity$ | async as entity\">\r\n <vdr-page-entity-info [entity]=\"entity\"></vdr-page-entity-info>\r\n </vdr-card>\r\n </vdr-page-detail-sidebar>\r\n\r\n <vdr-page-block>\r\n <button type=\"submit\" hidden x-data=\"prevents enter key from triggering other buttons\"></button>\r\n <vdr-card>\r\n <div class=\"form-grid\">\r\n <div>\r\n <vdr-form-field [label]=\"'catalog.product-name' | translate\" for=\"name\">\r\n <input\r\n id=\"name\"\r\n type=\"text\"\r\n formControlName=\"name\"\r\n [readonly]=\"!(updatePermissions | hasPermission)\"\r\n (input)=\"updateSlug($event.target.value)\"\r\n />\r\n </vdr-form-field>\r\n <div *ngIf=\"(isNew$ | async) === false && detailForm.get(['name'])?.dirty\">\r\n <clr-checkbox-wrapper>\r\n <input\r\n clrCheckbox\r\n type=\"checkbox\"\r\n id=\"auto-update\"\r\n formControlName=\"autoUpdateVariantNames\"\r\n />\r\n <label>{{ 'catalog.auto-update-product-variant-name' | translate }}</label>\r\n </clr-checkbox-wrapper>\r\n </div>\r\n </div>\r\n <vdr-form-field\r\n [label]=\"'catalog.slug' | translate\"\r\n for=\"slug\"\r\n [errors]=\"{ pattern: 'catalog.slug-pattern-error' | translate }\"\r\n >\r\n <input\r\n id=\"slug\"\r\n type=\"text\"\r\n formControlName=\"slug\"\r\n [readonly]=\"!(updatePermissions | hasPermission)\"\r\n />\r\n </vdr-form-field>\r\n <vdr-form-field\r\n class=\"form-grid-span\"\r\n [label]=\"'common.description' | translate\"\r\n for=\"slug\"\r\n [errors]=\"{ pattern: 'catalog.slug-pattern-error' | translate }\"\r\n >\r\n <vdr-rich-text-editor\r\n formControlName=\"description\"\r\n [readonly]=\"!(updatePermissions | hasPermission)\"\r\n ></vdr-rich-text-editor>\r\n </vdr-form-field>\r\n </div>\r\n </vdr-card>\r\n <vdr-card [title]=\"'common.custom-fields' | translate\" *ngIf=\"customFields.length\">\r\n <vdr-tabbed-custom-fields\r\n entityName=\"Product\"\r\n [customFields]=\"customFields\"\r\n [customFieldsFormGroup]=\"detailForm.get('customFields')\"\r\n [readonly]=\"!(updatePermissions | hasPermission)\"\r\n ></vdr-tabbed-custom-fields>\r\n </vdr-card>\r\n <vdr-custom-detail-component-host\r\n locationId=\"product-detail\"\r\n [entity$]=\"entity$\"\r\n [detailForm]=\"detailForm\"\r\n ></vdr-custom-detail-component-host>\r\n <vdr-card [title]=\"'catalog.assets' | translate\">\r\n <vdr-assets\r\n [assets]=\"assetChanges.assets || entity?.assets\"\r\n [featuredAsset]=\"assetChanges.featuredAsset || entity?.featuredAsset\"\r\n [updatePermissions]=\"updatePermissions\"\r\n (change)=\"assetChanges = $event\"\r\n ></vdr-assets>\r\n </vdr-card>\r\n\r\n <vdr-card [title]=\"'catalog.product-variants' | translate\" [paddingX]=\"isNew$ | async\">\r\n <div *ngIf=\"isNew$ | async; else variantList\">\r\n <vdr-generate-product-variants\r\n (variantsChange)=\"createVariantsConfig = $event\"\r\n ></vdr-generate-product-variants>\r\n </div>\r\n <ng-template #variantList>\r\n <vdr-product-variant-list\r\n [productId]=\"this.id\"\r\n dataTableId=\"product-detail-variants-list\"\r\n [hideLanguageSelect]=\"true\"\r\n ></vdr-product-variant-list>\r\n </ng-template>\r\n <div class=\"mx-3\" *ngIf=\"(isNew$ | async) === false\">\r\n <a class=\"button\" [routerLink]=\"['manage-variants']\">\r\n <clr-icon shape=\"add-text\"></clr-icon>\r\n {{ 'catalog.manage-variants' | translate }}</a\r\n >\r\n </div>\r\n </vdr-card>\r\n </vdr-page-block>\r\n </vdr-page-detail-layout>\r\n</form>\r\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: ["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"], 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 }); }
|
|
3773
3773
|
}
|
|
3774
3774
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: ProductDetailComponent, decorators: [{
|
|
3775
3775
|
type: Component,
|
|
3776
|
-
args: [{ selector: 'vdr-product-detail2', changeDetection: ChangeDetectionStrategy.OnPush, template: "<vdr-page-block>\r\n <vdr-action-bar>\r\n <vdr-ab-left>\r\n <div class=\"flex clr-flex-row\"></div>\r\n <vdr-language-selector\r\n [disabled]=\"isNew$ | async\"\r\n [availableLanguageCodes]=\"availableLanguages$ | async\"\r\n [currentLanguageCode]=\"languageCode$ | async\"\r\n (languageCodeChange)=\"setLanguage($event)\"\r\n ></vdr-language-selector>\r\n </vdr-ab-left>\r\n\r\n <vdr-ab-right>\r\n <vdr-action-bar-items locationId=\"product-detail\"></vdr-action-bar-items>\r\n <button\r\n class=\"btn btn-primary\"\r\n *ngIf=\"isNew$ | async; else updateButton\"\r\n (click)=\"create()\"\r\n [disabled]=\"detailForm.invalid || detailForm.pristine || createVariantsConfig.variants.length === 0\"\r\n >\r\n {{ 'common.create' | translate }}\r\n </button>\r\n <ng-template #updateButton>\r\n <button\r\n *vdrIfPermissions=\"updatePermissions\"\r\n class=\"btn btn-primary\"\r\n (click)=\"save()\"\r\n [disabled]=\"(detailForm.invalid || detailForm.pristine) && !assetsChanged()\"\r\n >\r\n {{ 'common.update' | translate }}\r\n </button>\r\n </ng-template>\r\n <vdr-action-bar-dropdown-menu locationId=\"product-detail\"></vdr-action-bar-dropdown-menu>\r\n </vdr-ab-right>\r\n </vdr-action-bar>\r\n</vdr-page-block>\r\n\r\n<form class=\"form\" [formGroup]=\"detailForm\">\r\n <vdr-page-detail-layout>\r\n <vdr-page-detail-sidebar>\r\n <vdr-card>\r\n <vdr-form-field [label]=\"'catalog.visibility' | translate\" for=\"visibility\">\r\n <clr-toggle-wrapper *vdrIfPermissions=\"updatePermissions\">\r\n <input\r\n type=\"checkbox\"\r\n clrToggle\r\n name=\"enabled\"\r\n [formControl]=\"detailForm.get(['enabled'])\"\r\n />\r\n <label>{{ 'common.enabled' | translate }}</label>\r\n </clr-toggle-wrapper>\r\n </vdr-form-field>\r\n </vdr-card>\r\n <ng-container *ngIf=\"!(isNew$ | async)\">\r\n <vdr-card *vdrIfMultichannel [title]=\"'common.channels' | translate\">\r\n <vdr-form-item *vdrIfDefaultChannelActive>\r\n <div class=\"flex channel-assignment\">\r\n <div class=\"mb-2\">\r\n <ng-container *ngFor=\"let channel of productChannels$ | async\">\r\n <vdr-chip\r\n *ngIf=\"!isDefaultChannel(channel.code)\"\r\n icon=\"times-circle\"\r\n (iconClick)=\"removeFromChannel(channel.id)\"\r\n >\r\n <vdr-channel-badge [channelCode]=\"channel.code\"></vdr-channel-badge>\r\n {{ channel.code | channelCodeToLabel }}\r\n </vdr-chip>\r\n </ng-container>\r\n </div>\r\n <button class=\"button-small\" (click)=\"assignToChannel()\">\r\n <clr-icon shape=\"layers\"></clr-icon>\r\n {{ 'common.assign-to-channel' | translate }}\r\n </button>\r\n </div>\r\n </vdr-form-item>\r\n </vdr-card>\r\n </ng-container>\r\n <vdr-card *ngIf=\"entity?.optionGroups.length\" [title]=\"'catalog.product-options' | translate\">\r\n <div class=\"options\">\r\n <vdr-chip\r\n *ngFor=\"let optionGroup of entity?.optionGroups | sort : 'id'\"\r\n [colorFrom]=\"optionGroup.code\"\r\n [invert]=\"true\"\r\n >\r\n {{ optionGroup.name }}\r\n </vdr-chip>\r\n </div>\r\n <div>\r\n <a [routerLink]=\"['options']\" class=\"button-small mt-2\" *vdrIfPermissions=\"updatePermissions\">\r\n <clr-icon shape=\"pencil\"></clr-icon>\r\n {{ 'catalog.edit-options' | translate }}\r\n </a>\r\n </div>\r\n </vdr-card>\r\n <vdr-card [title]=\"'catalog.facets' | translate\">\r\n <div class=\"facets\">\r\n <vdr-facet-value-chip\r\n *ngFor=\"let facetValue of facetValues$ | async\"\r\n [facetValue]=\"facetValue\"\r\n [removable]=\"updatePermissions | hasPermission\"\r\n (remove)=\"removeProductFacetValue(facetValue.id)\"\r\n ></vdr-facet-value-chip>\r\n </div>\r\n <div>\r\n <button\r\n class=\"button-small mt-2\"\r\n *vdrIfPermissions=\"updatePermissions\"\r\n (click)=\"selectProductFacetValue()\"\r\n >\r\n <clr-icon shape=\"plus\"></clr-icon>\r\n {{ 'catalog.add-facets' | translate }}\r\n </button>\r\n </div>\r\n </vdr-card>\r\n <vdr-card *ngIf=\"entity$ | async as entity\">\r\n <vdr-page-entity-info [entity]=\"entity\"></vdr-page-entity-info>\r\n </vdr-card>\r\n </vdr-page-detail-sidebar>\r\n\r\n <vdr-page-block>\r\n <button type=\"submit\" hidden x-data=\"prevents enter key from triggering other buttons\"></button>\r\n <vdr-card>\r\n <div class=\"form-grid\">\r\n <div>\r\n <vdr-form-field [label]=\"'catalog.product-name' | translate\" for=\"name\">\r\n <input\r\n id=\"name\"\r\n type=\"text\"\r\n formControlName=\"name\"\r\n [readonly]=\"!(updatePermissions | hasPermission)\"\r\n (input)=\"updateSlug($event.target.value)\"\r\n />\r\n </vdr-form-field>\r\n <div *ngIf=\"(isNew$ | async) === false && detailForm.get(['name'])?.dirty\">\r\n <clr-checkbox-wrapper>\r\n <input\r\n clrCheckbox\r\n type=\"checkbox\"\r\n id=\"auto-update\"\r\n formControlName=\"autoUpdateVariantNames\"\r\n />\r\n <label>{{ 'catalog.auto-update-product-variant-name' | translate }}</label>\r\n </clr-checkbox-wrapper>\r\n </div>\r\n </div>\r\n <vdr-form-field\r\n [label]=\"'catalog.slug' | translate\"\r\n for=\"slug\"\r\n [errors]=\"{ pattern: 'catalog.slug-pattern-error' | translate }\"\r\n >\r\n <input\r\n id=\"slug\"\r\n type=\"text\"\r\n formControlName=\"slug\"\r\n [readonly]=\"!(updatePermissions | hasPermission)\"\r\n />\r\n </vdr-form-field>\r\n <vdr-form-field\r\n class=\"form-grid-span\"\r\n [label]=\"'common.description' | translate\"\r\n for=\"slug\"\r\n [errors]=\"{ pattern: 'catalog.slug-pattern-error' | translate }\"\r\n >\r\n <vdr-rich-text-editor\r\n formControlName=\"description\"\r\n [readonly]=\"!(updatePermissions | hasPermission)\"\r\n ></vdr-rich-text-editor>\r\n </vdr-form-field>\r\n </div>\r\n </vdr-card>\r\n <vdr-card [title]=\"'common.custom-fields' | translate\" *ngIf=\"customFields.length\">\r\n <vdr-tabbed-custom-fields\r\n entityName=\"Product\"\r\n [customFields]=\"customFields\"\r\n [customFieldsFormGroup]=\"detailForm.get('customFields')\"\r\n [readonly]=\"!(updatePermissions | hasPermission)\"\r\n ></vdr-tabbed-custom-fields>\r\n </vdr-card>\r\n <vdr-custom-detail-component-host\r\n locationId=\"product-detail\"\r\n [entity$]=\"entity$\"\r\n [detailForm]=\"detailForm\"\r\n ></vdr-custom-detail-component-host>\r\n <vdr-card [title]=\"'catalog.assets' | translate\">\r\n <vdr-assets\r\n [assets]=\"assetChanges.assets || entity?.assets\"\r\n [featuredAsset]=\"assetChanges.featuredAsset || entity?.featuredAsset\"\r\n [updatePermissions]=\"updatePermissions\"\r\n (change)=\"assetChanges = $event\"\r\n ></vdr-assets>\r\n </vdr-card>\r\n\r\n <vdr-card [title]=\"'catalog.product-variants' | translate\" [paddingX]=\"isNew$ | async\">\r\n <div *ngIf=\"isNew$ | async; else variantList\">\r\n <vdr-generate-product-variants\r\n (variantsChange)=\"createVariantsConfig = $event\"\r\n ></vdr-generate-product-variants>\r\n </div>\r\n <ng-template #variantList>\r\n <vdr-product-variant-list\r\n [productId]=\"this.id\"\r\n dataTableId=\"product-detail-variants-list\"\r\n [hideLanguageSelect]=\"true\"\r\n ></vdr-product-variant-list>\r\n </ng-template>\r\n <div class=\"mx-3\" *ngIf=\"(isNew$ | async) === false\">\r\n <a class=\"button\" [routerLink]=\"['manage-variants']\">\r\n <clr-icon shape=\"add-text\"></clr-icon>\r\n {{ 'catalog.manage-variants' | translate }}</a\r\n >\r\n </div>\r\n </vdr-card>\r\n </vdr-page-block>\r\n </vdr-page-detail-layout>\r\n</form>\r\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;max-height:144px}.pagination-row{display:flex;align-items:baseline;justify-content:space-between}\n"] }]
|
|
3776
|
+
args: [{ selector: 'vdr-product-detail2', changeDetection: ChangeDetectionStrategy.OnPush, template: "<vdr-page-block>\r\n <vdr-action-bar>\r\n <vdr-ab-left>\r\n <div class=\"flex clr-flex-row\"></div>\r\n <vdr-language-selector\r\n [disabled]=\"isNew$ | async\"\r\n [availableLanguageCodes]=\"availableLanguages$ | async\"\r\n [currentLanguageCode]=\"languageCode$ | async\"\r\n (languageCodeChange)=\"setLanguage($event)\"\r\n ></vdr-language-selector>\r\n </vdr-ab-left>\r\n\r\n <vdr-ab-right>\r\n <vdr-action-bar-items locationId=\"product-detail\"></vdr-action-bar-items>\r\n <button\r\n class=\"btn btn-primary\"\r\n *ngIf=\"isNew$ | async; else updateButton\"\r\n (click)=\"create()\"\r\n [disabled]=\"detailForm.invalid || detailForm.pristine || createVariantsConfig.variants.length === 0\"\r\n >\r\n {{ 'common.create' | translate }}\r\n </button>\r\n <ng-template #updateButton>\r\n <button\r\n *vdrIfPermissions=\"updatePermissions\"\r\n class=\"btn btn-primary\"\r\n (click)=\"save()\"\r\n [disabled]=\"(detailForm.invalid || detailForm.pristine) && !assetsChanged()\"\r\n >\r\n {{ 'common.update' | translate }}\r\n </button>\r\n </ng-template>\r\n <vdr-action-bar-dropdown-menu locationId=\"product-detail\"></vdr-action-bar-dropdown-menu>\r\n </vdr-ab-right>\r\n </vdr-action-bar>\r\n</vdr-page-block>\r\n\r\n<form class=\"form\" [formGroup]=\"detailForm\">\r\n <vdr-page-detail-layout>\r\n <vdr-page-detail-sidebar>\r\n <vdr-card>\r\n <vdr-form-field [label]=\"'catalog.visibility' | translate\" for=\"visibility\">\r\n <clr-toggle-wrapper *vdrIfPermissions=\"updatePermissions\">\r\n <input\r\n type=\"checkbox\"\r\n clrToggle\r\n name=\"enabled\"\r\n [formControl]=\"detailForm.get(['enabled'])\"\r\n />\r\n <label>{{ 'common.enabled' | translate }}</label>\r\n </clr-toggle-wrapper>\r\n </vdr-form-field>\r\n </vdr-card>\r\n <ng-container *ngIf=\"!(isNew$ | async)\">\r\n <vdr-card *vdrIfMultichannel [title]=\"'common.channels' | translate\">\r\n <vdr-form-item *vdrIfDefaultChannelActive>\r\n <div class=\"flex channel-assignment\">\r\n <div class=\"mb-2\">\r\n <ng-container *ngFor=\"let channel of productChannels$ | async\">\r\n <vdr-chip\r\n *ngIf=\"!isDefaultChannel(channel.code)\"\r\n icon=\"times-circle\"\r\n (iconClick)=\"removeFromChannel(channel.id)\"\r\n >\r\n <vdr-channel-badge [channelCode]=\"channel.code\"></vdr-channel-badge>\r\n {{ channel.code | channelCodeToLabel }}\r\n </vdr-chip>\r\n </ng-container>\r\n </div>\r\n <button class=\"button-small\" (click)=\"assignToChannel()\">\r\n <clr-icon shape=\"layers\"></clr-icon>\r\n {{ 'common.assign-to-channel' | translate }}\r\n </button>\r\n </div>\r\n </vdr-form-item>\r\n </vdr-card>\r\n </ng-container>\r\n <vdr-card *ngIf=\"entity?.optionGroups.length\" [title]=\"'catalog.product-options' | translate\">\r\n <div class=\"options\">\r\n <vdr-chip\r\n *ngFor=\"let optionGroup of entity?.optionGroups | sort : 'id'\"\r\n [colorFrom]=\"optionGroup.code\"\r\n [invert]=\"true\"\r\n >\r\n {{ optionGroup.name }}\r\n </vdr-chip>\r\n </div>\r\n <div>\r\n <a [routerLink]=\"['options']\" class=\"button-small mt-2\" *vdrIfPermissions=\"updatePermissions\">\r\n <clr-icon shape=\"pencil\"></clr-icon>\r\n {{ 'catalog.edit-options' | translate }}\r\n </a>\r\n </div>\r\n </vdr-card>\r\n <vdr-card [title]=\"'catalog.facets' | translate\">\r\n <div class=\"facets\">\r\n <vdr-facet-value-chip\r\n *ngFor=\"let facetValue of facetValues$ | async\"\r\n [facetValue]=\"facetValue\"\r\n [removable]=\"updatePermissions | hasPermission\"\r\n (remove)=\"removeProductFacetValue(facetValue.id)\"\r\n ></vdr-facet-value-chip>\r\n </div>\r\n <div>\r\n <button\r\n class=\"button-small mt-2\"\r\n *vdrIfPermissions=\"updatePermissions\"\r\n (click)=\"selectProductFacetValue()\"\r\n >\r\n <clr-icon shape=\"plus\"></clr-icon>\r\n {{ 'catalog.add-facets' | translate }}\r\n </button>\r\n </div>\r\n </vdr-card>\r\n <vdr-card *ngIf=\"entity$ | async as entity\">\r\n <vdr-page-entity-info [entity]=\"entity\"></vdr-page-entity-info>\r\n </vdr-card>\r\n </vdr-page-detail-sidebar>\r\n\r\n <vdr-page-block>\r\n <button type=\"submit\" hidden x-data=\"prevents enter key from triggering other buttons\"></button>\r\n <vdr-card>\r\n <div class=\"form-grid\">\r\n <div>\r\n <vdr-form-field [label]=\"'catalog.product-name' | translate\" for=\"name\">\r\n <input\r\n id=\"name\"\r\n type=\"text\"\r\n formControlName=\"name\"\r\n [readonly]=\"!(updatePermissions | hasPermission)\"\r\n (input)=\"updateSlug($event.target.value)\"\r\n />\r\n </vdr-form-field>\r\n <div *ngIf=\"(isNew$ | async) === false && detailForm.get(['name'])?.dirty\">\r\n <clr-checkbox-wrapper>\r\n <input\r\n clrCheckbox\r\n type=\"checkbox\"\r\n id=\"auto-update\"\r\n formControlName=\"autoUpdateVariantNames\"\r\n />\r\n <label>{{ 'catalog.auto-update-product-variant-name' | translate }}</label>\r\n </clr-checkbox-wrapper>\r\n </div>\r\n </div>\r\n <vdr-form-field\r\n [label]=\"'catalog.slug' | translate\"\r\n for=\"slug\"\r\n [errors]=\"{ pattern: 'catalog.slug-pattern-error' | translate }\"\r\n >\r\n <input\r\n id=\"slug\"\r\n type=\"text\"\r\n formControlName=\"slug\"\r\n [readonly]=\"!(updatePermissions | hasPermission)\"\r\n />\r\n </vdr-form-field>\r\n <vdr-form-field\r\n class=\"form-grid-span\"\r\n [label]=\"'common.description' | translate\"\r\n for=\"slug\"\r\n [errors]=\"{ pattern: 'catalog.slug-pattern-error' | translate }\"\r\n >\r\n <vdr-rich-text-editor\r\n formControlName=\"description\"\r\n [readonly]=\"!(updatePermissions | hasPermission)\"\r\n ></vdr-rich-text-editor>\r\n </vdr-form-field>\r\n </div>\r\n </vdr-card>\r\n <vdr-card [title]=\"'common.custom-fields' | translate\" *ngIf=\"customFields.length\">\r\n <vdr-tabbed-custom-fields\r\n entityName=\"Product\"\r\n [customFields]=\"customFields\"\r\n [customFieldsFormGroup]=\"detailForm.get('customFields')\"\r\n [readonly]=\"!(updatePermissions | hasPermission)\"\r\n ></vdr-tabbed-custom-fields>\r\n </vdr-card>\r\n <vdr-custom-detail-component-host\r\n locationId=\"product-detail\"\r\n [entity$]=\"entity$\"\r\n [detailForm]=\"detailForm\"\r\n ></vdr-custom-detail-component-host>\r\n <vdr-card [title]=\"'catalog.assets' | translate\">\r\n <vdr-assets\r\n [assets]=\"assetChanges.assets || entity?.assets\"\r\n [featuredAsset]=\"assetChanges.featuredAsset || entity?.featuredAsset\"\r\n [updatePermissions]=\"updatePermissions\"\r\n (change)=\"assetChanges = $event\"\r\n ></vdr-assets>\r\n </vdr-card>\r\n\r\n <vdr-card [title]=\"'catalog.product-variants' | translate\" [paddingX]=\"isNew$ | async\">\r\n <div *ngIf=\"isNew$ | async; else variantList\">\r\n <vdr-generate-product-variants\r\n (variantsChange)=\"createVariantsConfig = $event\"\r\n ></vdr-generate-product-variants>\r\n </div>\r\n <ng-template #variantList>\r\n <vdr-product-variant-list\r\n [productId]=\"this.id\"\r\n dataTableId=\"product-detail-variants-list\"\r\n [hideLanguageSelect]=\"true\"\r\n ></vdr-product-variant-list>\r\n </ng-template>\r\n <div class=\"mx-3\" *ngIf=\"(isNew$ | async) === false\">\r\n <a class=\"button\" [routerLink]=\"['manage-variants']\">\r\n <clr-icon shape=\"add-text\"></clr-icon>\r\n {{ 'catalog.manage-variants' | translate }}</a\r\n >\r\n </div>\r\n </vdr-card>\r\n </vdr-page-block>\r\n </vdr-page-detail-layout>\r\n</form>\r\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"] }]
|
|
3777
3777
|
}], ctorParameters: () => [{ type: ProductDetailService }, { type: i2.FormBuilder }, { type: i1.ModalService }, { type: i1.NotificationService }, { type: i1.DataService }, { type: i0.ChangeDetectorRef }] });
|
|
3778
3778
|
|
|
3779
3779
|
const deleteProductsBulkAction = {
|