@snabcentr/client-ui 2.5.2 → 2.6.1
Sign up to get free protection for your applications and to get access to all the features.
- package/esm2022/cart/cart-item-mobile/sc-cart-item-mobile.component.mjs +3 -3
- package/esm2022/catalog/input-quantity/sc-input-quantity.component.mjs +3 -3
- package/esm2022/catalog/price-card/sc-price-card.component.mjs +3 -3
- package/esm2022/catalog/sc-favorite-btn/sc-favorite-btn.component.mjs +3 -3
- package/fesm2022/snabcentr-client-ui.mjs +8 -8
- package/fesm2022/snabcentr-client-ui.mjs.map +1 -1
- package/package.json +1 -1
- package/release_notes.tmp +3 -4
- package/styles/taiga/variables.less +29 -0
- package/styles/tailwind/tailwind.scss +10 -0
- /package/icons/svg-pack/catalog/{door-accessorie.svg → door-accessories.svg} +0 -0
|
@@ -3148,11 +3148,11 @@ class ScFavoriteBtnComponent {
|
|
|
3148
3148
|
this.disabled = false;
|
|
3149
3149
|
}
|
|
3150
3150
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: ScFavoriteBtnComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3151
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.8", type: ScFavoriteBtnComponent, selector: "sc-favorite-btn", inputs: { isFavorite: "isFavorite", showLoader: "showLoader", disabled: "disabled" }, outputs: { clickEvent: "clickEvent" }, ngImport: i0, template: "<button\n tuiIconButton\n (click)=\"clickEvent.emit()\"\n [disabled]=\"disabled\"\n [loading]=\"showLoader\"\n appearance=\"flat\"\n size=\"s\"\n>\n <tui-icon\n class=\"text-tui-primary\"\n [icon]=\"isFavorite ? '@tui.bookmark-filled' : '@tui.bookmark'\"\n ></tui-icon>\n</button>\n", dependencies: [{ kind: "directive", type: i1$1.TuiButton, selector: "a[tuiButton],button[tuiButton],a[tuiIconButton],button[tuiIconButton]", inputs: ["size"] }, { kind: "component", type: i1$1.TuiIcon, selector: "tui-icon", inputs: ["icon", "background"] }, { kind: "component", type: i2$1.TuiButtonLoading, selector: "[tuiButton][loading],[tuiIconButton][loading]", inputs: ["size", "loading"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
3151
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.8", type: ScFavoriteBtnComponent, selector: "sc-favorite-btn", inputs: { isFavorite: "isFavorite", showLoader: "showLoader", disabled: "disabled" }, outputs: { clickEvent: "clickEvent" }, ngImport: i0, template: "<button\n tuiIconButton\n (click)=\"clickEvent.emit()\"\n [disabled]=\"disabled\"\n [loading]=\"showLoader\"\n appearance=\"flat\"\n size=\"s\"\n>\n <tui-icon\n class=\"text-tui-primary !text-xl\"\n [icon]=\"isFavorite ? '@tui.bookmark-filled' : '@tui.bookmark'\"\n ></tui-icon>\n</button>\n", dependencies: [{ kind: "directive", type: i1$1.TuiButton, selector: "a[tuiButton],button[tuiButton],a[tuiIconButton],button[tuiIconButton]", inputs: ["size"] }, { kind: "component", type: i1$1.TuiIcon, selector: "tui-icon", inputs: ["icon", "background"] }, { kind: "component", type: i2$1.TuiButtonLoading, selector: "[tuiButton][loading],[tuiIconButton][loading]", inputs: ["size", "loading"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
3152
3152
|
}
|
|
3153
3153
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: ScFavoriteBtnComponent, decorators: [{
|
|
3154
3154
|
type: Component,
|
|
3155
|
-
args: [{ selector: 'sc-favorite-btn', changeDetection: ChangeDetectionStrategy.OnPush, template: "<button\n tuiIconButton\n (click)=\"clickEvent.emit()\"\n [disabled]=\"disabled\"\n [loading]=\"showLoader\"\n appearance=\"flat\"\n size=\"s\"\n>\n <tui-icon\n class=\"text-tui-primary\"\n [icon]=\"isFavorite ? '@tui.bookmark-filled' : '@tui.bookmark'\"\n ></tui-icon>\n</button>\n" }]
|
|
3155
|
+
args: [{ selector: 'sc-favorite-btn', changeDetection: ChangeDetectionStrategy.OnPush, template: "<button\n tuiIconButton\n (click)=\"clickEvent.emit()\"\n [disabled]=\"disabled\"\n [loading]=\"showLoader\"\n appearance=\"flat\"\n size=\"s\"\n>\n <tui-icon\n class=\"text-tui-primary !text-xl\"\n [icon]=\"isFavorite ? '@tui.bookmark-filled' : '@tui.bookmark'\"\n ></tui-icon>\n</button>\n" }]
|
|
3156
3156
|
}], propDecorators: { clickEvent: [{
|
|
3157
3157
|
type: Output
|
|
3158
3158
|
}], isFavorite: [{
|
|
@@ -3387,11 +3387,11 @@ class ScInputQuantityComponent extends AbstractTuiNullableControl {
|
|
|
3387
3387
|
this.clickClearEvent.emit();
|
|
3388
3388
|
}
|
|
3389
3389
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: ScInputQuantityComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
3390
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.8", type: ScInputQuantityComponent, selector: "sc-input-quantity", inputs: { step: "step", showLoader: "showLoader", showCross: "showCross", ignoreStepValidators: "ignoreStepValidators", appearance: "appearance", isDisabled: "isDisabled", size: "size" }, outputs: { clickClearEvent: "clickClearEvent" }, host: { listeners: { "keydown.arrowDown": "onArrow(-step)", "keydown.arrowUp": "onArrow(step)" }, properties: { "attr.data-appearance": "this.appearance", "attr.data-disabled": "this.isDisabled", "attr.data-size": "this.size" } }, viewQueries: [{ propertyName: "numberInput", first: true, predicate: TuiInputNumberComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<tui-loader\n *ngIf=\"formControl\"\n class=\"w-full\"\n [overlay]=\"true\"\n [showLoader]=\"showLoader\"\n [size]=\"size\"\n>\n <div class=\"flex items-center gap-1 text-center\">\n <div class=\"field-with-button flex grow rounded-xl\">\n <button\n tuiIconButton\n [appearance]=\"appearance\"\n [
|
|
3390
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.8", type: ScInputQuantityComponent, selector: "sc-input-quantity", inputs: { step: "step", showLoader: "showLoader", showCross: "showCross", ignoreStepValidators: "ignoreStepValidators", appearance: "appearance", isDisabled: "isDisabled", size: "size" }, outputs: { clickClearEvent: "clickClearEvent" }, host: { listeners: { "keydown.arrowDown": "onArrow(-step)", "keydown.arrowUp": "onArrow(step)" }, properties: { "attr.data-appearance": "this.appearance", "attr.data-disabled": "this.isDisabled", "attr.data-size": "this.size" } }, viewQueries: [{ propertyName: "numberInput", first: true, predicate: TuiInputNumberComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<tui-loader\n *ngIf=\"formControl\"\n class=\"w-full\"\n [overlay]=\"true\"\n [showLoader]=\"showLoader\"\n [size]=\"size\"\n>\n <div class=\"flex items-center gap-1 text-center\">\n <div class=\"field-with-button flex grow rounded-xl\">\n <button\n tuiIconButton\n [appearance]=\"appearance\"\n [size]=\"size\"\n [disabled]=\"!numberInput['canDecrement']\"\n (click.prevent)=\"decrement(true)\"\n >\n <tui-icon icon=\"@tui.minus\"></tui-icon>\n </button>\n <tui-input-number\n #numberInput\n [formControl]=\"formControl\"\n [tuiHint]=\"([] | tuiFieldError | async)?.message\"\n [tuiTextfieldLabelOutside]=\"true\"\n [min]=\"ignoreStepValidators ? 1 : step\"\n [tuiTextfieldSize]=\"size\"\n [required]=\"true\"\n [style.text-align]=\"'center'\"\n [style.font-weight]=\"700\"\n (focusin)=\"$any($event.target).select()\"\n oncontextmenu=\"return false;\"\n class=\"grow\"\n >\n </tui-input-number>\n <button\n tuiIconButton\n [appearance]=\"appearance\"\n [size]=\"size\"\n [disabled]=\"!numberInput['canIncrement']\"\n (click.prevent)=\"incident(true)\"\n >\n <tui-icon icon=\"@tui.plus\"></tui-icon>\n </button>\n </div>\n <button\n *ngIf=\"showCross\"\n tuiIconButton\n [appearance]=\"appearance\"\n [size]=\"size\"\n [disabled]=\"!numberInput['canIncrement']\"\n (click.prevent)=\"clear()\"\n >\n <tui-icon icon=\"@tui.x\"></tui-icon>\n </button>\n </div>\n</tui-loader>\n", styles: [":host [data-size=l]{--tui-height-l: var(--tui-height-m);--tui-font-text-m: bold .875rem/1.25rem var(--tui-font-text);--tui-padding-l: 0}:host [data-size=m]{--tui-height-m: var(--tui-height-s);--tui-font-text-s: bold .75rem/1rem var(--tui-font-text);--tui-padding-m: 0}:host [data-size=m] tui-svg{font-size:12px!important}:host [data-size=s]{--tui-height-s: var(--tui-height-xs);--tui-font-text-s: bold .75rem/1rem var(--tui-font-text);--tui-padding-s: 0}:host [data-size=s] tui-svg{font-size:12px!important}:host[data-disabled=true]{pointer-events:none;opacity:var(--tui-disabled-opacity)}:host[data-appearance=secondary] .field-with-button{background-color:var(--tui-background-base);box-shadow:inset 0 0 0 .0625rem var(--tui-background-neutral-1-hover)}:host[data-appearance=primary] .field-with-button{background-color:var(--tui-status-warning-pale)}:host .field-with-button:has(._invalid){background-color:var(--tui-status-negative-pale)}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.TuiButton, selector: "a[tuiButton],button[tuiButton],a[tuiIconButton],button[tuiIconButton]", inputs: ["size"] }, { kind: "component", type: i1$1.TuiIcon, selector: "tui-icon", inputs: ["icon", "background"] }, { kind: "component", type: i5.TuiInputNumberComponent, selector: "tui-input-number", inputs: ["min", "max", "step"] }, { kind: "directive", type: i5.TuiInputNumberDirective, selector: "tui-input-number" }, { kind: "directive", type: i5.TuiTextfieldLabelOutsideDirective, selector: "[tuiTextfieldLabelOutside]", inputs: ["tuiTextfieldLabelOutside"] }, { kind: "directive", type: i5.TuiTextfieldSizeDirective, selector: "[tuiTextfieldSize]", inputs: ["tuiTextfieldSize"] }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.TuiHintDirective, selector: "[tuiHint]:not(ng-container):not(ng-template)", inputs: ["tuiHintContext", "tuiHintAppearance", "tuiHint"] }, { kind: "component", type: i1$1.TuiLoader, selector: "tui-loader", inputs: ["size", "inheritColor", "overlay", "textContent", "showLoader"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i2$1.TuiFieldErrorPipe, name: "tuiFieldError" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
3391
3391
|
}
|
|
3392
3392
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: ScInputQuantityComponent, decorators: [{
|
|
3393
3393
|
type: Component,
|
|
3394
|
-
args: [{ selector: 'sc-input-quantity', changeDetection: ChangeDetectionStrategy.OnPush, template: "<tui-loader\n *ngIf=\"formControl\"\n class=\"w-full\"\n [overlay]=\"true\"\n [showLoader]=\"showLoader\"\n [size]=\"size\"\n>\n <div class=\"flex items-center gap-1 text-center\">\n <div class=\"field-with-button flex grow rounded-xl\">\n <button\n tuiIconButton\n [appearance]=\"appearance\"\n [
|
|
3394
|
+
args: [{ selector: 'sc-input-quantity', changeDetection: ChangeDetectionStrategy.OnPush, template: "<tui-loader\n *ngIf=\"formControl\"\n class=\"w-full\"\n [overlay]=\"true\"\n [showLoader]=\"showLoader\"\n [size]=\"size\"\n>\n <div class=\"flex items-center gap-1 text-center\">\n <div class=\"field-with-button flex grow rounded-xl\">\n <button\n tuiIconButton\n [appearance]=\"appearance\"\n [size]=\"size\"\n [disabled]=\"!numberInput['canDecrement']\"\n (click.prevent)=\"decrement(true)\"\n >\n <tui-icon icon=\"@tui.minus\"></tui-icon>\n </button>\n <tui-input-number\n #numberInput\n [formControl]=\"formControl\"\n [tuiHint]=\"([] | tuiFieldError | async)?.message\"\n [tuiTextfieldLabelOutside]=\"true\"\n [min]=\"ignoreStepValidators ? 1 : step\"\n [tuiTextfieldSize]=\"size\"\n [required]=\"true\"\n [style.text-align]=\"'center'\"\n [style.font-weight]=\"700\"\n (focusin)=\"$any($event.target).select()\"\n oncontextmenu=\"return false;\"\n class=\"grow\"\n >\n </tui-input-number>\n <button\n tuiIconButton\n [appearance]=\"appearance\"\n [size]=\"size\"\n [disabled]=\"!numberInput['canIncrement']\"\n (click.prevent)=\"incident(true)\"\n >\n <tui-icon icon=\"@tui.plus\"></tui-icon>\n </button>\n </div>\n <button\n *ngIf=\"showCross\"\n tuiIconButton\n [appearance]=\"appearance\"\n [size]=\"size\"\n [disabled]=\"!numberInput['canIncrement']\"\n (click.prevent)=\"clear()\"\n >\n <tui-icon icon=\"@tui.x\"></tui-icon>\n </button>\n </div>\n</tui-loader>\n", styles: [":host [data-size=l]{--tui-height-l: var(--tui-height-m);--tui-font-text-m: bold .875rem/1.25rem var(--tui-font-text);--tui-padding-l: 0}:host [data-size=m]{--tui-height-m: var(--tui-height-s);--tui-font-text-s: bold .75rem/1rem var(--tui-font-text);--tui-padding-m: 0}:host [data-size=m] tui-svg{font-size:12px!important}:host [data-size=s]{--tui-height-s: var(--tui-height-xs);--tui-font-text-s: bold .75rem/1rem var(--tui-font-text);--tui-padding-s: 0}:host [data-size=s] tui-svg{font-size:12px!important}:host[data-disabled=true]{pointer-events:none;opacity:var(--tui-disabled-opacity)}:host[data-appearance=secondary] .field-with-button{background-color:var(--tui-background-base);box-shadow:inset 0 0 0 .0625rem var(--tui-background-neutral-1-hover)}:host[data-appearance=primary] .field-with-button{background-color:var(--tui-status-warning-pale)}:host .field-with-button:has(._invalid){background-color:var(--tui-status-negative-pale)}\n"] }]
|
|
3395
3395
|
}], propDecorators: { numberInput: [{
|
|
3396
3396
|
type: ViewChild,
|
|
3397
3397
|
args: [TuiInputNumberComponent]
|
|
@@ -3503,11 +3503,11 @@ class ScPriceCardComponent extends AbstractScPriceCard {
|
|
|
3503
3503
|
this.cdr.markForCheck();
|
|
3504
3504
|
}
|
|
3505
3505
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: ScPriceCardComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3506
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.8", type: ScPriceCardComponent, selector: "sc-price-card", inputs: { size: "size" }, host: { properties: { "attr.data-size": "this.size", "attr.is_mobile": "this.isMobile", "attr.is_in_cart": "this.isInCart" } }, providers: [SEARCH_TERM_PROVIDERS], usesInheritance: true, ngImport: i0, template: "<div\n *ngIf=\"product; else skeleton\"\n class=\"card-wrapper relative flex w-auto min-w-40 flex-col rounded-xl shadow-md\"\n>\n <div class=\"flex grow flex-col justify-center overflow-hidden rounded-xl p-2\">\n <img\n (click)=\"clickCardEvent.emit()\"\n [src]=\"getCardImagePreview()\"\n [alt]=\"product.name\"\n class=\"max-h-full w-full rounded-xl object-cover\"\n />\n <sc-favorite-btn\n *ngIf=\"authStatus$ | async\"\n class=\"absolute left-2 top-2\"\n (clickEvent)=\"clickFavoriteEvent.emit()\"\n [showLoader]=\"favoriteShowLoader\"\n [isFavorite]=\"product.isFavorite\"\n [disabled]=\"!!product.primaryCategory?.isFavorite\"\n ></sc-favorite-btn>\n <div class=\"absolute right-2 top-2 m-1 flex gap-2\">\n <tui-icon \n *ngIf=\"product.isPreviouslyOrdered\"\n icon=\"@tui.star\"\n class=\"!size-6 rounded-lg !fill-white text-tui-negative\"\n ></tui-icon>\n <tui-icon \n *ngIf=\"product.cartItem\"\n icon=\"@tui.check\"\n class=\"!size-6 rounded-lg bg-tui-primary text-white\"\n ></tui-icon>\n </div>\n </div>\n <div class=\"p-2\">\n <tui-elastic-container class=\"shrink-0\">\n <a\n tuiLink\n class=\"name\"\n \n [tuiHighlight]=\"(search$ | async) ?? ''\"\n (click)=\"clickCardEvent.emit()\"\n >\n {{ product.name }}\n </a>\n </tui-elastic-container>\n <tui-elastic-container class=\"shrink-0\">\n <p\n *ngIf=\"product?.pack\"\n class=\"text-tui-text-02\"\n >\n \u041D\u043E\u0440\u043C\u0430 \u0443\u043F\u0430\u043A\u043E\u0432\u043A\u0438: {{ product.pack }}\n <tui-svg\n *ngIf=\"product.ignoreMinCountCheck\"\n src=\"tuiIconPackage\"\n [tuiHint]=\"minCountHint\"\n [tuiHintShowDelay]=\"100\"\n tuiHintDirection=\"top\"\n ></tui-svg>\n <ng-template #minCountHint>\n \u0414\u043E\u0441\u0442\u0443\u043F\u0435\u043D \u0437\u0430\u043A\u0430\u0437 <br />\n \u043F\u0440\u043E\u0438\u0437\u0432\u043E\u043B\u044C\u043D\u043E\u0433\u043E <br />\n \u043A\u043E\u043B\u0438\u0447\u0435\u0441\u0442\u0432\u0430\n </ng-template>\n </p>\n <p\n [tuiHighlight]=\"(search$ | async) ?? ''\"\n class=\"code text-tui-text-02\"\n >\n \u0410\u0440\u0442\u0438\u043A\u0443\u043B: {{ product.code }}\n </p>\n\n <a\n tuiLink\n *ngIf=\"!isMobile && (authStatus$ | async) && product?.costDate\"\n \n aria-disabled=\"true\"\n class=\"history\"\n (click)=\"clickPriceHistoryEvent.emit()\"\n >\n \u0414\u0430\u0442\u0430: {{ product.costDate }}\n </a>\n </tui-elastic-container>\n <div\n *ngIf=\"warehouseSelect$ | async as warehouseSelect\"\n class=\"flex flex-col\"\n >\n <span\n *ngIf=\"product.discount && !isMobile\"\n class=\"flex items-center text-tui-text-02\"\n >\n <span class=\"line-through\">{{ product.discountCostString }}</span> \n <span class=\"font-bold text-tui-success-fill\"> -{{ product.discount.percent }}% </span>\n <tui-icon \n icon=\"@tui.info\"\n [tuiHint]=\"discountHint\"\n [tuiHintShowDelay]=\"100\"\n tuiHintDirection=\"top\"\n class=\"!h-4 text-black\"\n ></tui-icon>\n <ng-template #discountHint>\n <div class=\"font-bold\">{{ product.discount.name }}</div>\n <div *ngIf=\"product.discount.expiredAt as expiredAt\">\u0414\u0430\u0442\u0430 \u043E\u043A\u043E\u043D\u0447\u0430\u043D\u0438\u044F: {{ expiredAt }}</div>\n </ng-template>\n </span>\n <span\n [class.text-tui-text-02]=\"!product.isWarehouseStockExist(warehouseSelect.id)\"\n class=\"cost font-bold\"\n >{{ product.costRubString }}</span\n >\n <span\n *ngIf=\"!product.priceInRub\"\n class=\"hidden font-bold text-tui-text-02 group-hover:block\"\n >{{ product.costString }}</span\n >\n <sc-price-warehouse-stock [product]=\"product\"></sc-price-warehouse-stock>\n </div>\n <div class=\"cart-actions flex shrink-0 overflow-hidden\">\n <button\n *ngIf=\"!showQuantityControl\"\n tuiButton\n (click)=\"clickAddToCartEvent.emit(product)\"\n [loading]=\"quantityShowLoader\"\n [size]=\"size === 's' ? 'xs' : 's'\"\n class=\"mt-2 grow\"\n iconStart=\"@tui.shopping-cart\"\n >\n \u0412 \u043A\u043E\u0440\u0437\u0438\u043D\u0443\n </button>\n <sc-input-quantity\n #inputQuantity\n *ngIf=\"showQuantityControl\"\n [formControl]=\"quantityControl\"\n [size]=\"size\"\n [step]=\"unitsHelper.productMultiplicity(product)\"\n [ignoreStepValidators]=\"product.ignoreMinCountCheck\"\n [showLoader]=\"quantityShowLoader\"\n (clickClearEvent)=\"clickClearEvent.emit(cartItem)\"\n class=\"mt-2 w-full\"\n (keydown.enter)=\"inputQuantity.nativeFocusableElement?.blur()\"\n ></sc-input-quantity>\n </div>\n </div>\n</div>\n\n<ng-template #skeleton>\n <div class=\"card-wrapper flex flex-col overflow-hidden rounded-xl bg-white shadow-sc-1\">\n <!-- \u0418\u0437\u043E\u0431\u0440\u0430\u0436\u0435\u043D\u0438\u0435 \u0442\u043E\u0432\u0430\u0440\u0430 -->\n <div class=\"h-3/5 w-full rounded-t bg-tui-base-02\"></div>\n <!-- \u041A\u0440\u0430\u0442\u043A\u0430\u044F \u0438\u043D\u0444\u043E\u0440\u043C\u0430\u0446\u0438\u044F \u043E \u0442\u043E\u0432\u0430\u0440\u0435 -->\n <div class=\"flex grow flex-col gap-2.5 rounded-b bg-white p-5\">\n <div class=\"h-4 w-full rounded bg-tui-base-02\"></div>\n <div class=\"h-4 w-3/5 rounded bg-tui-base-02\"></div>\n <div class=\"h-4 w-full rounded bg-tui-base-02\"></div>\n </div>\n </div>\n</ng-template>\n", styles: [":host .name{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4}:host[data-size=s] .card-wrapper{height:16rem;font:var(--tui-font-text-xs)}:host[data-size=s] .card-wrapper .name,:host[data-size=s] .card-wrapper .cost{font:var(--tui-font-text-s);font-weight:800}:host[data-size=m] .card-wrapper{height:20rem;font:var(--tui-font-text-s)}:host[data-size=m] .card-wrapper .name,:host[data-size=m] .card-wrapper .cost{font:var(--tui-font-text-m);font-weight:800}:host[is_mobile=false][is_in_cart=false] .name{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}:host[is_mobile=false][is_in_cart=false] .code,:host[is_mobile=false][is_in_cart=false] .history{display:none}:host[is_mobile=false][is_in_cart=false] .cart-actions{max-height:0;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out}:host[is_mobile=false][is_in_cart=false]:hover .code,:host[is_mobile=false][is_in_cart=false]:hover .history,:host[is_mobile=false][is_in_cart=false]:hover .name{display:-webkit-box;-webkit-line-clamp:4}:host[is_mobile=false][is_in_cart=false]:hover .cart-actions{max-height:3rem}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.TuiButton, selector: "a[tuiButton],button[tuiButton],a[tuiIconButton],button[tuiIconButton]", inputs: ["size"] }, { kind: "component", type: i1$1.TuiIcon, selector: "tui-icon", inputs: ["icon", "background"] }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.TuiHintDirective, selector: "[tuiHint]:not(ng-container):not(ng-template)", inputs: ["tuiHintContext", "tuiHintAppearance", "tuiHint"] }, { kind: "directive", type: i1$1.TuiLink, selector: "a[tuiLink], button[tuiLink]", inputs: ["pseudo"] }, { kind: "component", type: i2$1.TuiElasticContainer, selector: "tui-elastic-container" }, { kind: "directive", type: i2$1.TuiHighlight, selector: "[tuiHighlight]", inputs: ["tuiHighlight", "tuiHighlightColor"] }, { kind: "component", type: i2$1.TuiButtonLoading, selector: "[tuiButton][loading],[tuiIconButton][loading]", inputs: ["size", "loading"] }, { kind: "component", type: ScFavoriteBtnComponent, selector: "sc-favorite-btn", inputs: ["isFavorite", "showLoader", "disabled"], outputs: ["clickEvent"] }, { kind: "component", type: ScInputQuantityComponent, selector: "sc-input-quantity", inputs: ["step", "showLoader", "showCross", "ignoreStepValidators", "appearance", "isDisabled", "size"], outputs: ["clickClearEvent"] }, { kind: "component", type: ScPriceWarehouseStockComponent, selector: "sc-price-warehouse-stock", inputs: ["classList", "product", "withStockHint", "fromMain"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
3506
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.8", type: ScPriceCardComponent, selector: "sc-price-card", inputs: { size: "size" }, host: { properties: { "attr.data-size": "this.size", "attr.is_mobile": "this.isMobile", "attr.is_in_cart": "this.isInCart" } }, providers: [SEARCH_TERM_PROVIDERS], usesInheritance: true, ngImport: i0, template: "<div\n *ngIf=\"product; else skeleton\"\n class=\"card-wrapper relative flex w-auto min-w-40 flex-col rounded-xl shadow-md\"\n>\n <div class=\"flex grow flex-col justify-center overflow-hidden rounded-xl p-2\">\n <img\n (click)=\"clickCardEvent.emit()\"\n [src]=\"getCardImagePreview()\"\n [alt]=\"product.name\"\n class=\"max-h-full w-full rounded-xl object-cover\"\n />\n <sc-favorite-btn\n *ngIf=\"authStatus$ | async\"\n class=\"absolute left-2 top-2\"\n (clickEvent)=\"clickFavoriteEvent.emit()\"\n [showLoader]=\"favoriteShowLoader\"\n [isFavorite]=\"product.isFavorite\"\n [disabled]=\"!!product.primaryCategory?.isFavorite\"\n ></sc-favorite-btn>\n <div class=\"absolute right-2 top-2 m-1 flex gap-2\">\n <tui-icon\n *ngIf=\"product.isPreviouslyOrdered\"\n icon=\"@tui.star\"\n class=\"!size-6 rounded-lg !fill-white text-tui-negative\"\n ></tui-icon>\n <tui-icon\n *ngIf=\"product.cartItem\"\n icon=\"@tui.check\"\n class=\"!size-6 rounded-lg bg-tui-primary text-white\"\n ></tui-icon>\n </div>\n </div>\n <div class=\"p-2\">\n <tui-elastic-container class=\"shrink-0\">\n <a\n tuiLink\n class=\"name\"\n [tuiHighlight]=\"(search$ | async) ?? ''\"\n (click)=\"clickCardEvent.emit()\"\n >\n {{ product.name }}\n </a>\n </tui-elastic-container>\n <tui-elastic-container class=\"shrink-0\">\n <p\n *ngIf=\"product?.pack\"\n class=\"flex items-center gap-1 text-tui-text-02\"\n >\n \u041D\u043E\u0440\u043C\u0430 \u0443\u043F\u0430\u043A\u043E\u0432\u043A\u0438: {{ product.pack }}\n <tui-icon\n *ngIf=\"product.ignoreMinCountCheck\"\n icon=\"@tui.package\"\n [tuiHint]=\"minCountHint\"\n [tuiHintShowDelay]=\"100\"\n tuiHintDirection=\"top\"\n class=\"text-xl\"\n ></tui-icon>\n <ng-template #minCountHint>\n \u0414\u043E\u0441\u0442\u0443\u043F\u0435\u043D \u0437\u0430\u043A\u0430\u0437 <br />\n \u043F\u0440\u043E\u0438\u0437\u0432\u043E\u043B\u044C\u043D\u043E\u0433\u043E <br />\n \u043A\u043E\u043B\u0438\u0447\u0435\u0441\u0442\u0432\u0430\n </ng-template>\n </p>\n <p\n [tuiHighlight]=\"(search$ | async) ?? ''\"\n class=\"code text-tui-text-02\"\n >\n \u0410\u0440\u0442\u0438\u043A\u0443\u043B: {{ product.code }}\n </p>\n\n <a\n tuiLink\n *ngIf=\"!isMobile && (authStatus$ | async) && product?.costDate\"\n aria-disabled=\"true\"\n class=\"history\"\n (click)=\"clickPriceHistoryEvent.emit()\"\n >\n \u0414\u0430\u0442\u0430: {{ product.costDate }}\n </a>\n </tui-elastic-container>\n <div\n *ngIf=\"warehouseSelect$ | async as warehouseSelect\"\n class=\"flex flex-col\"\n >\n <span\n *ngIf=\"product.discount && !isMobile\"\n class=\"flex items-center text-tui-text-02\"\n >\n <span class=\"line-through\">{{ product.discountCostString }}</span> \n <span class=\"font-bold text-tui-success-fill\"> -{{ product.discount.percent }}% </span>\n <tui-icon\n icon=\"@tui.info\"\n [tuiHint]=\"discountHint\"\n [tuiHintShowDelay]=\"100\"\n tuiHintDirection=\"top\"\n class=\"!h-4 text-black\"\n ></tui-icon>\n <ng-template #discountHint>\n <div class=\"font-bold\">{{ product.discount.name }}</div>\n <div *ngIf=\"product.discount.expiredAt as expiredAt\">\u0414\u0430\u0442\u0430 \u043E\u043A\u043E\u043D\u0447\u0430\u043D\u0438\u044F: {{ expiredAt }}</div>\n </ng-template>\n </span>\n <span\n [class.text-tui-text-02]=\"!product.isWarehouseStockExist(warehouseSelect.id)\"\n class=\"cost font-bold\"\n >{{ product.costRubString }}</span\n >\n <span\n *ngIf=\"!product.priceInRub\"\n class=\"hidden font-bold text-tui-text-02 group-hover:block\"\n >{{ product.costString }}</span\n >\n <sc-price-warehouse-stock [product]=\"product\"></sc-price-warehouse-stock>\n </div>\n <div class=\"cart-actions flex shrink-0 overflow-hidden\">\n <button\n *ngIf=\"!showQuantityControl\"\n tuiButton\n (click)=\"clickAddToCartEvent.emit(product)\"\n [loading]=\"quantityShowLoader\"\n [size]=\"size === 's' ? 'xs' : 's'\"\n class=\"mt-2 grow\"\n iconStart=\"@tui.shopping-cart\"\n >\n \u0412 \u043A\u043E\u0440\u0437\u0438\u043D\u0443\n </button>\n <sc-input-quantity\n #inputQuantity\n *ngIf=\"showQuantityControl\"\n [formControl]=\"quantityControl\"\n [size]=\"size\"\n [step]=\"unitsHelper.productMultiplicity(product)\"\n [ignoreStepValidators]=\"product.ignoreMinCountCheck\"\n [showLoader]=\"quantityShowLoader\"\n (clickClearEvent)=\"clickClearEvent.emit(cartItem)\"\n class=\"mt-2 w-full\"\n (keydown.enter)=\"inputQuantity.nativeFocusableElement?.blur()\"\n ></sc-input-quantity>\n </div>\n </div>\n</div>\n\n<ng-template #skeleton>\n <div class=\"card-wrapper flex flex-col overflow-hidden rounded-xl bg-white shadow-sc-1\">\n <!-- \u0418\u0437\u043E\u0431\u0440\u0430\u0436\u0435\u043D\u0438\u0435 \u0442\u043E\u0432\u0430\u0440\u0430 -->\n <div class=\"h-3/5 w-full rounded-t bg-tui-base-02\"></div>\n <!-- \u041A\u0440\u0430\u0442\u043A\u0430\u044F \u0438\u043D\u0444\u043E\u0440\u043C\u0430\u0446\u0438\u044F \u043E \u0442\u043E\u0432\u0430\u0440\u0435 -->\n <div class=\"flex grow flex-col gap-2.5 rounded-b bg-white p-5\">\n <div class=\"h-4 w-full rounded bg-tui-base-02\"></div>\n <div class=\"h-4 w-3/5 rounded bg-tui-base-02\"></div>\n <div class=\"h-4 w-full rounded bg-tui-base-02\"></div>\n </div>\n </div>\n</ng-template>\n", styles: [":host .name{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4}:host[data-size=s] .card-wrapper{height:16rem;font:var(--tui-font-text-xs)}:host[data-size=s] .card-wrapper .name,:host[data-size=s] .card-wrapper .cost{font:var(--tui-font-text-s);font-weight:800}:host[data-size=m] .card-wrapper{height:20rem;font:var(--tui-font-text-s)}:host[data-size=m] .card-wrapper .name,:host[data-size=m] .card-wrapper .cost{font:var(--tui-font-text-m);font-weight:800}:host[is_mobile=false][is_in_cart=false] .name{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}:host[is_mobile=false][is_in_cart=false] .code,:host[is_mobile=false][is_in_cart=false] .history{display:none}:host[is_mobile=false][is_in_cart=false] .cart-actions{max-height:0;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out}:host[is_mobile=false][is_in_cart=false]:hover .code,:host[is_mobile=false][is_in_cart=false]:hover .history,:host[is_mobile=false][is_in_cart=false]:hover .name{display:-webkit-box;-webkit-line-clamp:4}:host[is_mobile=false][is_in_cart=false]:hover .cart-actions{max-height:3rem}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.TuiButton, selector: "a[tuiButton],button[tuiButton],a[tuiIconButton],button[tuiIconButton]", inputs: ["size"] }, { kind: "component", type: i1$1.TuiIcon, selector: "tui-icon", inputs: ["icon", "background"] }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.TuiHintDirective, selector: "[tuiHint]:not(ng-container):not(ng-template)", inputs: ["tuiHintContext", "tuiHintAppearance", "tuiHint"] }, { kind: "directive", type: i1$1.TuiLink, selector: "a[tuiLink], button[tuiLink]", inputs: ["pseudo"] }, { kind: "component", type: i2$1.TuiElasticContainer, selector: "tui-elastic-container" }, { kind: "directive", type: i2$1.TuiHighlight, selector: "[tuiHighlight]", inputs: ["tuiHighlight", "tuiHighlightColor"] }, { kind: "component", type: i2$1.TuiButtonLoading, selector: "[tuiButton][loading],[tuiIconButton][loading]", inputs: ["size", "loading"] }, { kind: "component", type: ScFavoriteBtnComponent, selector: "sc-favorite-btn", inputs: ["isFavorite", "showLoader", "disabled"], outputs: ["clickEvent"] }, { kind: "component", type: ScInputQuantityComponent, selector: "sc-input-quantity", inputs: ["step", "showLoader", "showCross", "ignoreStepValidators", "appearance", "isDisabled", "size"], outputs: ["clickClearEvent"] }, { kind: "component", type: ScPriceWarehouseStockComponent, selector: "sc-price-warehouse-stock", inputs: ["classList", "product", "withStockHint", "fromMain"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
3507
3507
|
}
|
|
3508
3508
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: ScPriceCardComponent, decorators: [{
|
|
3509
3509
|
type: Component,
|
|
3510
|
-
args: [{ selector: 'sc-price-card', providers: [SEARCH_TERM_PROVIDERS], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n *ngIf=\"product; else skeleton\"\n class=\"card-wrapper relative flex w-auto min-w-40 flex-col rounded-xl shadow-md\"\n>\n <div class=\"flex grow flex-col justify-center overflow-hidden rounded-xl p-2\">\n <img\n (click)=\"clickCardEvent.emit()\"\n [src]=\"getCardImagePreview()\"\n [alt]=\"product.name\"\n class=\"max-h-full w-full rounded-xl object-cover\"\n />\n <sc-favorite-btn\n *ngIf=\"authStatus$ | async\"\n class=\"absolute left-2 top-2\"\n (clickEvent)=\"clickFavoriteEvent.emit()\"\n [showLoader]=\"favoriteShowLoader\"\n [isFavorite]=\"product.isFavorite\"\n [disabled]=\"!!product.primaryCategory?.isFavorite\"\n ></sc-favorite-btn>\n <div class=\"absolute right-2 top-2 m-1 flex gap-2\">\n <tui-icon
|
|
3510
|
+
args: [{ selector: 'sc-price-card', providers: [SEARCH_TERM_PROVIDERS], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n *ngIf=\"product; else skeleton\"\n class=\"card-wrapper relative flex w-auto min-w-40 flex-col rounded-xl shadow-md\"\n>\n <div class=\"flex grow flex-col justify-center overflow-hidden rounded-xl p-2\">\n <img\n (click)=\"clickCardEvent.emit()\"\n [src]=\"getCardImagePreview()\"\n [alt]=\"product.name\"\n class=\"max-h-full w-full rounded-xl object-cover\"\n />\n <sc-favorite-btn\n *ngIf=\"authStatus$ | async\"\n class=\"absolute left-2 top-2\"\n (clickEvent)=\"clickFavoriteEvent.emit()\"\n [showLoader]=\"favoriteShowLoader\"\n [isFavorite]=\"product.isFavorite\"\n [disabled]=\"!!product.primaryCategory?.isFavorite\"\n ></sc-favorite-btn>\n <div class=\"absolute right-2 top-2 m-1 flex gap-2\">\n <tui-icon\n *ngIf=\"product.isPreviouslyOrdered\"\n icon=\"@tui.star\"\n class=\"!size-6 rounded-lg !fill-white text-tui-negative\"\n ></tui-icon>\n <tui-icon\n *ngIf=\"product.cartItem\"\n icon=\"@tui.check\"\n class=\"!size-6 rounded-lg bg-tui-primary text-white\"\n ></tui-icon>\n </div>\n </div>\n <div class=\"p-2\">\n <tui-elastic-container class=\"shrink-0\">\n <a\n tuiLink\n class=\"name\"\n [tuiHighlight]=\"(search$ | async) ?? ''\"\n (click)=\"clickCardEvent.emit()\"\n >\n {{ product.name }}\n </a>\n </tui-elastic-container>\n <tui-elastic-container class=\"shrink-0\">\n <p\n *ngIf=\"product?.pack\"\n class=\"flex items-center gap-1 text-tui-text-02\"\n >\n \u041D\u043E\u0440\u043C\u0430 \u0443\u043F\u0430\u043A\u043E\u0432\u043A\u0438: {{ product.pack }}\n <tui-icon\n *ngIf=\"product.ignoreMinCountCheck\"\n icon=\"@tui.package\"\n [tuiHint]=\"minCountHint\"\n [tuiHintShowDelay]=\"100\"\n tuiHintDirection=\"top\"\n class=\"text-xl\"\n ></tui-icon>\n <ng-template #minCountHint>\n \u0414\u043E\u0441\u0442\u0443\u043F\u0435\u043D \u0437\u0430\u043A\u0430\u0437 <br />\n \u043F\u0440\u043E\u0438\u0437\u0432\u043E\u043B\u044C\u043D\u043E\u0433\u043E <br />\n \u043A\u043E\u043B\u0438\u0447\u0435\u0441\u0442\u0432\u0430\n </ng-template>\n </p>\n <p\n [tuiHighlight]=\"(search$ | async) ?? ''\"\n class=\"code text-tui-text-02\"\n >\n \u0410\u0440\u0442\u0438\u043A\u0443\u043B: {{ product.code }}\n </p>\n\n <a\n tuiLink\n *ngIf=\"!isMobile && (authStatus$ | async) && product?.costDate\"\n aria-disabled=\"true\"\n class=\"history\"\n (click)=\"clickPriceHistoryEvent.emit()\"\n >\n \u0414\u0430\u0442\u0430: {{ product.costDate }}\n </a>\n </tui-elastic-container>\n <div\n *ngIf=\"warehouseSelect$ | async as warehouseSelect\"\n class=\"flex flex-col\"\n >\n <span\n *ngIf=\"product.discount && !isMobile\"\n class=\"flex items-center text-tui-text-02\"\n >\n <span class=\"line-through\">{{ product.discountCostString }}</span> \n <span class=\"font-bold text-tui-success-fill\"> -{{ product.discount.percent }}% </span>\n <tui-icon\n icon=\"@tui.info\"\n [tuiHint]=\"discountHint\"\n [tuiHintShowDelay]=\"100\"\n tuiHintDirection=\"top\"\n class=\"!h-4 text-black\"\n ></tui-icon>\n <ng-template #discountHint>\n <div class=\"font-bold\">{{ product.discount.name }}</div>\n <div *ngIf=\"product.discount.expiredAt as expiredAt\">\u0414\u0430\u0442\u0430 \u043E\u043A\u043E\u043D\u0447\u0430\u043D\u0438\u044F: {{ expiredAt }}</div>\n </ng-template>\n </span>\n <span\n [class.text-tui-text-02]=\"!product.isWarehouseStockExist(warehouseSelect.id)\"\n class=\"cost font-bold\"\n >{{ product.costRubString }}</span\n >\n <span\n *ngIf=\"!product.priceInRub\"\n class=\"hidden font-bold text-tui-text-02 group-hover:block\"\n >{{ product.costString }}</span\n >\n <sc-price-warehouse-stock [product]=\"product\"></sc-price-warehouse-stock>\n </div>\n <div class=\"cart-actions flex shrink-0 overflow-hidden\">\n <button\n *ngIf=\"!showQuantityControl\"\n tuiButton\n (click)=\"clickAddToCartEvent.emit(product)\"\n [loading]=\"quantityShowLoader\"\n [size]=\"size === 's' ? 'xs' : 's'\"\n class=\"mt-2 grow\"\n iconStart=\"@tui.shopping-cart\"\n >\n \u0412 \u043A\u043E\u0440\u0437\u0438\u043D\u0443\n </button>\n <sc-input-quantity\n #inputQuantity\n *ngIf=\"showQuantityControl\"\n [formControl]=\"quantityControl\"\n [size]=\"size\"\n [step]=\"unitsHelper.productMultiplicity(product)\"\n [ignoreStepValidators]=\"product.ignoreMinCountCheck\"\n [showLoader]=\"quantityShowLoader\"\n (clickClearEvent)=\"clickClearEvent.emit(cartItem)\"\n class=\"mt-2 w-full\"\n (keydown.enter)=\"inputQuantity.nativeFocusableElement?.blur()\"\n ></sc-input-quantity>\n </div>\n </div>\n</div>\n\n<ng-template #skeleton>\n <div class=\"card-wrapper flex flex-col overflow-hidden rounded-xl bg-white shadow-sc-1\">\n <!-- \u0418\u0437\u043E\u0431\u0440\u0430\u0436\u0435\u043D\u0438\u0435 \u0442\u043E\u0432\u0430\u0440\u0430 -->\n <div class=\"h-3/5 w-full rounded-t bg-tui-base-02\"></div>\n <!-- \u041A\u0440\u0430\u0442\u043A\u0430\u044F \u0438\u043D\u0444\u043E\u0440\u043C\u0430\u0446\u0438\u044F \u043E \u0442\u043E\u0432\u0430\u0440\u0435 -->\n <div class=\"flex grow flex-col gap-2.5 rounded-b bg-white p-5\">\n <div class=\"h-4 w-full rounded bg-tui-base-02\"></div>\n <div class=\"h-4 w-3/5 rounded bg-tui-base-02\"></div>\n <div class=\"h-4 w-full rounded bg-tui-base-02\"></div>\n </div>\n </div>\n</ng-template>\n", styles: [":host .name{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4}:host[data-size=s] .card-wrapper{height:16rem;font:var(--tui-font-text-xs)}:host[data-size=s] .card-wrapper .name,:host[data-size=s] .card-wrapper .cost{font:var(--tui-font-text-s);font-weight:800}:host[data-size=m] .card-wrapper{height:20rem;font:var(--tui-font-text-s)}:host[data-size=m] .card-wrapper .name,:host[data-size=m] .card-wrapper .cost{font:var(--tui-font-text-m);font-weight:800}:host[is_mobile=false][is_in_cart=false] .name{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}:host[is_mobile=false][is_in_cart=false] .code,:host[is_mobile=false][is_in_cart=false] .history{display:none}:host[is_mobile=false][is_in_cart=false] .cart-actions{max-height:0;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out}:host[is_mobile=false][is_in_cart=false]:hover .code,:host[is_mobile=false][is_in_cart=false]:hover .history,:host[is_mobile=false][is_in_cart=false]:hover .name{display:-webkit-box;-webkit-line-clamp:4}:host[is_mobile=false][is_in_cart=false]:hover .cart-actions{max-height:3rem}\n"] }]
|
|
3511
3511
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { size: [{
|
|
3512
3512
|
type: Input
|
|
3513
3513
|
}, {
|
|
@@ -3870,11 +3870,11 @@ class ScCartItemMobileComponent {
|
|
|
3870
3870
|
return this.imageHelper.getImage(product);
|
|
3871
3871
|
}
|
|
3872
3872
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: ScCartItemMobileComponent, deps: [{ token: i1.ScUnitsHelper }, { token: TuiPreviewDialogService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3873
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.8", type: ScCartItemMobileComponent, selector: "sc-cart-item-mobile", inputs: { cartItem: "cartItem" }, outputs: { quantityValueChanges: "quantityValueChanges", clickDeleteEvent: "clickDeleteEvent", clickSettingsEvent: "clickSettingsEvent", clickCardEvent: "clickCardEvent" }, viewQueries: [{ propertyName: "specificationPreviewRef", first: true, predicate: ["specificationPreview"], descendants: true }], ngImport: i0, template: "<ng-container *ngIf=\"cartItem && product; else skeleton\">\n <div class=\"flex min-w-72 gap-2 rounded-xl border border-tui-base-04 bg-white p-2 shadow-sc-2\">\n <div class=\"flex w-40 items-center\">\n <img\n (click)=\"clickCardEvent.emit()\"\n [src]=\"getCardImage(product)\"\n [alt]=\"product.name\"\n class=\"max-h-full w-full rounded-xl object-cover\"\n />\n </div>\n <div class=\"flex w-full flex-col items-center justify-between gap-2 sm:flex-row sm:gap-5\">\n <div class=\"flex max-w-full flex-col gap-1 self-start\">\n <a\n tuiLink\n (click)=\"clickCardEvent.emit()\"\n >\n <span class=\"font-bold\">{{ product.name }}</span>\n </a>\n\n <div class=\"flex w-full flex-wrap gap-x-2 gap-y-1 text-xs text-tui-base-07\">\n <p *ngIf=\"product.pack\">\n \u041D\u043E\u0440\u043C\u0430 \u0443\u043F\u0430\u043A\u043E\u0432\u043A\u0438: {{ product.pack }}\n <tui-svg\n *ngIf=\"product.ignoreMinCountCheck\"\n src=\"tuiIconPackage\"\n [tuiHint]=\"minCountHint\"\n [tuiHintShowDelay]=\"100\"\n tuiHintDirection=\"top\"\n ></tui-svg>\n <ng-template #minCountHint>\n \u0414\u043E\u0441\u0442\u0443\u043F\u0435\u043D \u0437\u0430\u043A\u0430\u0437 <br />\n \u043F\u0440\u043E\u0438\u0437\u0432\u043E\u043B\u044C\u043D\u043E\u0433\u043E <br />\n \u043A\u043E\u043B\u0438\u0447\u0435\u0441\u0442\u0432\u0430\n </ng-template>\n </p>\n <p>\u0410\u0440\u0442\u0438\u043A\u0443\u043B: {{ product.code }}</p>\n </div>\n\n <div class=\"flex w-full flex-wrap items-center gap-x-2 gap-y-1\">\n <p\n *ngIf=\"!product.priceInRub\"\n class=\"font-bold\"\n >\n {{ product.costString }}\n </p>\n <p class=\"text-xs font-bold text-tui-text-01\">{{ product.costRubString }}</p>\n <span\n *ngIf=\"product.discount\"\n class=\"flex items-center\"\n >\n <span class=\"line-through\">{{ product.discountCostString }}</span> \n <span class=\"font-bold text-tui-success-fill\"> -{{ product.discount.percent }}% </span>\n <tui-icon\n icon=\"@tui.info\"\n [tuiHint]=\"discountHint\"\n [tuiHintShowDelay]=\"100\"\n tuiHintDirection=\"top\"\n class=\"!h-4 !text-xs\"\n ></tui-icon>\n <ng-template #discountHint>\n <div class=\"font-bold\">{{ product.discount.name }}</div>\n <div *ngIf=\"product.discount.expiredAt as expiredAt\">\u0414\u0430\u0442\u0430 \u043E\u043A\u043E\u043D\u0447\u0430\u043D\u0438\u044F: {{ expiredAt }}</div>\n </ng-template>\n </span>\n </div>\n\n <sc-price-warehouse-stock [product]=\"product\"></sc-price-warehouse-stock>\n\n <div\n *ngIf=\"cartItem.height || cartItem.length || cartItem.width\"\n class=\"flex items-center gap-1\"\n >\n <button\n tuiIconButton\n iconStart=\"@tui.settings\"\n (click)=\"clickSettingsEvent.emit()\"\n size=\"s\"\n appearance=\"secondary\"\n class=\"mr-2 !self-center\"\n ></button>\n <div class=\"flex flex-wrap gap-x-2 text-xs text-tui-base-07\">\n <p *ngIf=\"cartItem.marker\">\u041C\u0430\u0440\u043A\u0438\u0440\u043E\u0432\u043A\u0430: {{ cartItem.marker }}</p>\n <p *ngIf=\"cartItem.width\">\u0428\u0438\u0440\u0438\u043D\u0430: {{ cartItem.width }} \u043C.</p>\n <ng-container *ngIf=\"cartItem.height; else length\">\n <p>\u0412\u044B\u0441\u043E\u0442\u0430: {{ cartItem.height }} \u043C.</p>\n </ng-container>\n <ng-template #length>\n <p *ngIf=\"cartItem.length\">\u0414\u043B\u0438\u043D\u0430: {{ cartItem.length }} \u043C.</p>\n </ng-template>\n </div>\n </div>\n\n <a\n tuiLink\n *ngIf=\"cartItem.specificationImgUrl\"\n (click)=\"showSpecification()\"\n >\u0421\u043F\u0435\u0446\u0438\u0444\u0438\u043A\u0430\u0446\u0438\u044F</a\n >\n <ng-template\n #specificationPreview\n let-preview\n >\n <tui-preview\n [rotatable]=\"false\"\n [zoomable]=\"false\"\n >\n <img\n *polymorpheusOutlet=\"cartItem.specificationImgUrl as src\"\n alt=\"preview\"\n [src]=\"cartItem.specificationImgUrl\"\n />\n <button\n iconStart=\"@tui.x\"\n title=\"Close\"\n tuiIconButton\n tuiPreviewAction\n type=\"button\"\n (click)=\"preview.complete()\"\n ></button>\n </tui-preview>\n </ng-template>\n </div>\n <div class=\"flex flex-col gap-1 self-start sm:mr-9 sm:self-center\">\n <div class=\"flex gap-2\">\n <sc-input-quantity\n #inputQuantity\n *ngIf=\"quantityControl\"\n [formControl]=\"quantityControl\"\n [showCross]=\"false\"\n size=\"s\"\n [step]=\"unitsHelper.productMultiplicity(product)\"\n [ignoreStepValidators]=\"product.ignoreMinCountCheck\"\n (keydown.enter)=\"inputQuantity.nativeFocusableElement?.blur()\"\n class=\"w-28\"\n ></sc-input-quantity>\n <button\n tuiIconButton\n iconStart=\"@tui.trash-2\"\n [style.border-radius.%]=\"100\"\n size=\"xs\"\n (click)=\"clickDeleteEvent.emit()\"\n ></button>\n </div>\n <p class=\"text-sm font-bold text-tui-text-01\">\n \u0418\u0442\u043E\u0433\u043E: {{ cartItem.costRub | tuiFormatNumber: { precision: 2, decimalSeparator: '.', rounding: 'ceil' } | async }} {{ 'RUB' | tuiCurrency }}\n </p>\n </div>\n </div>\n </div>\n</ng-container>\n\n<ng-template #skeleton>\n <div class=\"flex w-full gap-2\">\n <div class=\"size-20 rounded-xl bg-tui-base-02\"></div>\n <div class=\"flex grow flex-col gap-2.5 bg-white\">\n <div class=\"h-4 w-full rounded-xl bg-tui-base-02\"></div>\n <div class=\"h-4 w-3/5 rounded-xl bg-tui-base-02\"></div>\n <div class=\"h-4 w-4/5 rounded-xl bg-tui-base-02\"></div>\n </div>\n </div>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.TuiLink, selector: "a[tuiLink], button[tuiLink]", inputs: ["pseudo"] }, { kind: "component", type: ScInputQuantityComponent, selector: "sc-input-quantity", inputs: ["step", "showLoader", "showCross", "ignoreStepValidators", "appearance", "isDisabled", "size"], outputs: ["clickClearEvent"] }, { kind: "component", type: ScPriceWarehouseStockComponent, selector: "sc-price-warehouse-stock", inputs: ["classList", "product", "withStockHint", "fromMain"] }, { kind: "directive", type: i1$1.TuiButton, selector: "a[tuiButton],button[tuiButton],a[tuiIconButton],button[tuiIconButton]", inputs: ["size"] }, { kind: "component", type: i1$1.TuiIcon, selector: "tui-icon", inputs: ["icon", "background"] }, { kind: "directive", type: i1$1.TuiHintDirective, selector: "[tuiHint]:not(ng-container):not(ng-template)", inputs: ["tuiHintContext", "tuiHintAppearance", "tuiHint"] }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i2$1.TuiPreviewComponent, selector: "tui-preview", inputs: ["zoomable", "rotatable"] }, { kind: "directive", type: i2$1.TuiPreviewAction, selector: "[tuiPreviewAction]" }, { kind: "directive", type: i2$2.PolymorpheusOutlet, selector: "[polymorpheusOutlet]", inputs: ["polymorpheusOutlet", "polymorpheusOutletContext"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i9.TuiCurrencyPipe, name: "tuiCurrency" }, { kind: "pipe", type: i1$1.TuiFormatNumberPipe, name: "tuiFormatNumber" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
3873
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.8", type: ScCartItemMobileComponent, selector: "sc-cart-item-mobile", inputs: { cartItem: "cartItem" }, outputs: { quantityValueChanges: "quantityValueChanges", clickDeleteEvent: "clickDeleteEvent", clickSettingsEvent: "clickSettingsEvent", clickCardEvent: "clickCardEvent" }, viewQueries: [{ propertyName: "specificationPreviewRef", first: true, predicate: ["specificationPreview"], descendants: true }], ngImport: i0, template: "<ng-container *ngIf=\"cartItem && product; else skeleton\">\n <div class=\"flex min-w-72 gap-2 rounded-xl border border-tui-base-04 bg-white p-2 shadow-sc-2\">\n <div class=\"flex w-40 items-center\">\n <img\n (click)=\"clickCardEvent.emit()\"\n [src]=\"getCardImage(product)\"\n [alt]=\"product.name\"\n class=\"max-h-full w-full rounded-xl object-cover\"\n />\n </div>\n <div class=\"flex w-full flex-col items-center justify-between gap-2 sm:flex-row sm:gap-5\">\n <div class=\"flex max-w-full flex-col gap-1 self-start\">\n <a\n tuiLink\n (click)=\"clickCardEvent.emit()\"\n >\n <span class=\"font-bold\">{{ product.name }}</span>\n </a>\n\n <div class=\"flex w-full flex-wrap gap-x-2 gap-y-1 text-xs text-tui-base-07\">\n <p *ngIf=\"product.pack\">\n \u041D\u043E\u0440\u043C\u0430 \u0443\u043F\u0430\u043A\u043E\u0432\u043A\u0438: {{ product.pack }}\n <tui-icon\n *ngIf=\"product.ignoreMinCountCheck\"\n icon=\"@tui.package\"\n [tuiHint]=\"minCountHint\"\n [tuiHintShowDelay]=\"100\"\n tuiHintDirection=\"top\"\n class=\"text-sm\"\n ></tui-icon>\n <ng-template #minCountHint>\n \u0414\u043E\u0441\u0442\u0443\u043F\u0435\u043D \u0437\u0430\u043A\u0430\u0437 <br />\n \u043F\u0440\u043E\u0438\u0437\u0432\u043E\u043B\u044C\u043D\u043E\u0433\u043E <br />\n \u043A\u043E\u043B\u0438\u0447\u0435\u0441\u0442\u0432\u0430\n </ng-template>\n </p>\n <p>\u0410\u0440\u0442\u0438\u043A\u0443\u043B: {{ product.code }}</p>\n </div>\n\n <div class=\"flex w-full flex-wrap items-center gap-x-2 gap-y-1\">\n <p\n *ngIf=\"!product.priceInRub\"\n class=\"font-bold\"\n >\n {{ product.costString }}\n </p>\n <p class=\"text-xs font-bold text-tui-text-01\">{{ product.costRubString }}</p>\n <span\n *ngIf=\"product.discount\"\n class=\"flex items-center\"\n >\n <span class=\"line-through\">{{ product.discountCostString }}</span> \n <span class=\"font-bold text-tui-success-fill\"> -{{ product.discount.percent }}% </span>\n <tui-icon\n icon=\"@tui.info\"\n [tuiHint]=\"discountHint\"\n [tuiHintShowDelay]=\"100\"\n tuiHintDirection=\"top\"\n class=\"!h-4 !text-xs\"\n ></tui-icon>\n <ng-template #discountHint>\n <div class=\"font-bold\">{{ product.discount.name }}</div>\n <div *ngIf=\"product.discount.expiredAt as expiredAt\">\u0414\u0430\u0442\u0430 \u043E\u043A\u043E\u043D\u0447\u0430\u043D\u0438\u044F: {{ expiredAt }}</div>\n </ng-template>\n </span>\n </div>\n\n <sc-price-warehouse-stock [product]=\"product\"></sc-price-warehouse-stock>\n\n <div\n *ngIf=\"cartItem.height || cartItem.length || cartItem.width\"\n class=\"flex items-center gap-1\"\n >\n <button\n tuiIconButton\n iconStart=\"@tui.settings\"\n (click)=\"clickSettingsEvent.emit()\"\n size=\"s\"\n appearance=\"secondary\"\n class=\"mr-2 !self-center\"\n ></button>\n <div class=\"flex flex-wrap gap-x-2 text-xs text-tui-base-07\">\n <p *ngIf=\"cartItem.marker\">\u041C\u0430\u0440\u043A\u0438\u0440\u043E\u0432\u043A\u0430: {{ cartItem.marker }}</p>\n <p *ngIf=\"cartItem.width\">\u0428\u0438\u0440\u0438\u043D\u0430: {{ cartItem.width }} \u043C.</p>\n <ng-container *ngIf=\"cartItem.height; else length\">\n <p>\u0412\u044B\u0441\u043E\u0442\u0430: {{ cartItem.height }} \u043C.</p>\n </ng-container>\n <ng-template #length>\n <p *ngIf=\"cartItem.length\">\u0414\u043B\u0438\u043D\u0430: {{ cartItem.length }} \u043C.</p>\n </ng-template>\n </div>\n </div>\n\n <a\n tuiLink\n *ngIf=\"cartItem.specificationImgUrl\"\n (click)=\"showSpecification()\"\n >\u0421\u043F\u0435\u0446\u0438\u0444\u0438\u043A\u0430\u0446\u0438\u044F</a\n >\n <ng-template\n #specificationPreview\n let-preview\n >\n <tui-preview\n [rotatable]=\"false\"\n [zoomable]=\"false\"\n >\n <img\n *polymorpheusOutlet=\"cartItem.specificationImgUrl as src\"\n alt=\"preview\"\n [src]=\"cartItem.specificationImgUrl\"\n />\n <button\n iconStart=\"@tui.x\"\n title=\"Close\"\n tuiIconButton\n tuiPreviewAction\n type=\"button\"\n (click)=\"preview.complete()\"\n ></button>\n </tui-preview>\n </ng-template>\n </div>\n <div class=\"flex flex-col gap-1 self-start sm:mr-9 sm:self-center\">\n <div class=\"flex gap-2\">\n <sc-input-quantity\n #inputQuantity\n *ngIf=\"quantityControl\"\n [formControl]=\"quantityControl\"\n [showCross]=\"false\"\n size=\"s\"\n [step]=\"unitsHelper.productMultiplicity(product)\"\n [ignoreStepValidators]=\"product.ignoreMinCountCheck\"\n (keydown.enter)=\"inputQuantity.nativeFocusableElement?.blur()\"\n class=\"w-28\"\n ></sc-input-quantity>\n <button\n tuiIconButton\n iconStart=\"@tui.trash-2\"\n [style.border-radius.%]=\"100\"\n size=\"xs\"\n (click)=\"clickDeleteEvent.emit()\"\n ></button>\n </div>\n <p class=\"text-sm font-bold text-tui-text-01\">\n \u0418\u0442\u043E\u0433\u043E: {{ cartItem.costRub | tuiFormatNumber: { precision: 2, decimalSeparator: '.', rounding: 'ceil' } | async }} {{ 'RUB' | tuiCurrency }}\n </p>\n </div>\n </div>\n </div>\n</ng-container>\n\n<ng-template #skeleton>\n <div class=\"flex w-full gap-2\">\n <div class=\"size-20 rounded-xl bg-tui-base-02\"></div>\n <div class=\"flex grow flex-col gap-2.5 bg-white\">\n <div class=\"h-4 w-full rounded-xl bg-tui-base-02\"></div>\n <div class=\"h-4 w-3/5 rounded-xl bg-tui-base-02\"></div>\n <div class=\"h-4 w-4/5 rounded-xl bg-tui-base-02\"></div>\n </div>\n </div>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.TuiLink, selector: "a[tuiLink], button[tuiLink]", inputs: ["pseudo"] }, { kind: "component", type: ScInputQuantityComponent, selector: "sc-input-quantity", inputs: ["step", "showLoader", "showCross", "ignoreStepValidators", "appearance", "isDisabled", "size"], outputs: ["clickClearEvent"] }, { kind: "component", type: ScPriceWarehouseStockComponent, selector: "sc-price-warehouse-stock", inputs: ["classList", "product", "withStockHint", "fromMain"] }, { kind: "directive", type: i1$1.TuiButton, selector: "a[tuiButton],button[tuiButton],a[tuiIconButton],button[tuiIconButton]", inputs: ["size"] }, { kind: "component", type: i1$1.TuiIcon, selector: "tui-icon", inputs: ["icon", "background"] }, { kind: "directive", type: i1$1.TuiHintDirective, selector: "[tuiHint]:not(ng-container):not(ng-template)", inputs: ["tuiHintContext", "tuiHintAppearance", "tuiHint"] }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i2$1.TuiPreviewComponent, selector: "tui-preview", inputs: ["zoomable", "rotatable"] }, { kind: "directive", type: i2$1.TuiPreviewAction, selector: "[tuiPreviewAction]" }, { kind: "directive", type: i2$2.PolymorpheusOutlet, selector: "[polymorpheusOutlet]", inputs: ["polymorpheusOutlet", "polymorpheusOutletContext"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i9.TuiCurrencyPipe, name: "tuiCurrency" }, { kind: "pipe", type: i1$1.TuiFormatNumberPipe, name: "tuiFormatNumber" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
3874
3874
|
}
|
|
3875
3875
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: ScCartItemMobileComponent, decorators: [{
|
|
3876
3876
|
type: Component,
|
|
3877
|
-
args: [{ selector: 'sc-cart-item-mobile', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"cartItem && product; else skeleton\">\n <div class=\"flex min-w-72 gap-2 rounded-xl border border-tui-base-04 bg-white p-2 shadow-sc-2\">\n <div class=\"flex w-40 items-center\">\n <img\n (click)=\"clickCardEvent.emit()\"\n [src]=\"getCardImage(product)\"\n [alt]=\"product.name\"\n class=\"max-h-full w-full rounded-xl object-cover\"\n />\n </div>\n <div class=\"flex w-full flex-col items-center justify-between gap-2 sm:flex-row sm:gap-5\">\n <div class=\"flex max-w-full flex-col gap-1 self-start\">\n <a\n tuiLink\n (click)=\"clickCardEvent.emit()\"\n >\n <span class=\"font-bold\">{{ product.name }}</span>\n </a>\n\n <div class=\"flex w-full flex-wrap gap-x-2 gap-y-1 text-xs text-tui-base-07\">\n <p *ngIf=\"product.pack\">\n \u041D\u043E\u0440\u043C\u0430 \u0443\u043F\u0430\u043A\u043E\u0432\u043A\u0438: {{ product.pack }}\n <tui-
|
|
3877
|
+
args: [{ selector: 'sc-cart-item-mobile', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"cartItem && product; else skeleton\">\n <div class=\"flex min-w-72 gap-2 rounded-xl border border-tui-base-04 bg-white p-2 shadow-sc-2\">\n <div class=\"flex w-40 items-center\">\n <img\n (click)=\"clickCardEvent.emit()\"\n [src]=\"getCardImage(product)\"\n [alt]=\"product.name\"\n class=\"max-h-full w-full rounded-xl object-cover\"\n />\n </div>\n <div class=\"flex w-full flex-col items-center justify-between gap-2 sm:flex-row sm:gap-5\">\n <div class=\"flex max-w-full flex-col gap-1 self-start\">\n <a\n tuiLink\n (click)=\"clickCardEvent.emit()\"\n >\n <span class=\"font-bold\">{{ product.name }}</span>\n </a>\n\n <div class=\"flex w-full flex-wrap gap-x-2 gap-y-1 text-xs text-tui-base-07\">\n <p *ngIf=\"product.pack\">\n \u041D\u043E\u0440\u043C\u0430 \u0443\u043F\u0430\u043A\u043E\u0432\u043A\u0438: {{ product.pack }}\n <tui-icon\n *ngIf=\"product.ignoreMinCountCheck\"\n icon=\"@tui.package\"\n [tuiHint]=\"minCountHint\"\n [tuiHintShowDelay]=\"100\"\n tuiHintDirection=\"top\"\n class=\"text-sm\"\n ></tui-icon>\n <ng-template #minCountHint>\n \u0414\u043E\u0441\u0442\u0443\u043F\u0435\u043D \u0437\u0430\u043A\u0430\u0437 <br />\n \u043F\u0440\u043E\u0438\u0437\u0432\u043E\u043B\u044C\u043D\u043E\u0433\u043E <br />\n \u043A\u043E\u043B\u0438\u0447\u0435\u0441\u0442\u0432\u0430\n </ng-template>\n </p>\n <p>\u0410\u0440\u0442\u0438\u043A\u0443\u043B: {{ product.code }}</p>\n </div>\n\n <div class=\"flex w-full flex-wrap items-center gap-x-2 gap-y-1\">\n <p\n *ngIf=\"!product.priceInRub\"\n class=\"font-bold\"\n >\n {{ product.costString }}\n </p>\n <p class=\"text-xs font-bold text-tui-text-01\">{{ product.costRubString }}</p>\n <span\n *ngIf=\"product.discount\"\n class=\"flex items-center\"\n >\n <span class=\"line-through\">{{ product.discountCostString }}</span> \n <span class=\"font-bold text-tui-success-fill\"> -{{ product.discount.percent }}% </span>\n <tui-icon\n icon=\"@tui.info\"\n [tuiHint]=\"discountHint\"\n [tuiHintShowDelay]=\"100\"\n tuiHintDirection=\"top\"\n class=\"!h-4 !text-xs\"\n ></tui-icon>\n <ng-template #discountHint>\n <div class=\"font-bold\">{{ product.discount.name }}</div>\n <div *ngIf=\"product.discount.expiredAt as expiredAt\">\u0414\u0430\u0442\u0430 \u043E\u043A\u043E\u043D\u0447\u0430\u043D\u0438\u044F: {{ expiredAt }}</div>\n </ng-template>\n </span>\n </div>\n\n <sc-price-warehouse-stock [product]=\"product\"></sc-price-warehouse-stock>\n\n <div\n *ngIf=\"cartItem.height || cartItem.length || cartItem.width\"\n class=\"flex items-center gap-1\"\n >\n <button\n tuiIconButton\n iconStart=\"@tui.settings\"\n (click)=\"clickSettingsEvent.emit()\"\n size=\"s\"\n appearance=\"secondary\"\n class=\"mr-2 !self-center\"\n ></button>\n <div class=\"flex flex-wrap gap-x-2 text-xs text-tui-base-07\">\n <p *ngIf=\"cartItem.marker\">\u041C\u0430\u0440\u043A\u0438\u0440\u043E\u0432\u043A\u0430: {{ cartItem.marker }}</p>\n <p *ngIf=\"cartItem.width\">\u0428\u0438\u0440\u0438\u043D\u0430: {{ cartItem.width }} \u043C.</p>\n <ng-container *ngIf=\"cartItem.height; else length\">\n <p>\u0412\u044B\u0441\u043E\u0442\u0430: {{ cartItem.height }} \u043C.</p>\n </ng-container>\n <ng-template #length>\n <p *ngIf=\"cartItem.length\">\u0414\u043B\u0438\u043D\u0430: {{ cartItem.length }} \u043C.</p>\n </ng-template>\n </div>\n </div>\n\n <a\n tuiLink\n *ngIf=\"cartItem.specificationImgUrl\"\n (click)=\"showSpecification()\"\n >\u0421\u043F\u0435\u0446\u0438\u0444\u0438\u043A\u0430\u0446\u0438\u044F</a\n >\n <ng-template\n #specificationPreview\n let-preview\n >\n <tui-preview\n [rotatable]=\"false\"\n [zoomable]=\"false\"\n >\n <img\n *polymorpheusOutlet=\"cartItem.specificationImgUrl as src\"\n alt=\"preview\"\n [src]=\"cartItem.specificationImgUrl\"\n />\n <button\n iconStart=\"@tui.x\"\n title=\"Close\"\n tuiIconButton\n tuiPreviewAction\n type=\"button\"\n (click)=\"preview.complete()\"\n ></button>\n </tui-preview>\n </ng-template>\n </div>\n <div class=\"flex flex-col gap-1 self-start sm:mr-9 sm:self-center\">\n <div class=\"flex gap-2\">\n <sc-input-quantity\n #inputQuantity\n *ngIf=\"quantityControl\"\n [formControl]=\"quantityControl\"\n [showCross]=\"false\"\n size=\"s\"\n [step]=\"unitsHelper.productMultiplicity(product)\"\n [ignoreStepValidators]=\"product.ignoreMinCountCheck\"\n (keydown.enter)=\"inputQuantity.nativeFocusableElement?.blur()\"\n class=\"w-28\"\n ></sc-input-quantity>\n <button\n tuiIconButton\n iconStart=\"@tui.trash-2\"\n [style.border-radius.%]=\"100\"\n size=\"xs\"\n (click)=\"clickDeleteEvent.emit()\"\n ></button>\n </div>\n <p class=\"text-sm font-bold text-tui-text-01\">\n \u0418\u0442\u043E\u0433\u043E: {{ cartItem.costRub | tuiFormatNumber: { precision: 2, decimalSeparator: '.', rounding: 'ceil' } | async }} {{ 'RUB' | tuiCurrency }}\n </p>\n </div>\n </div>\n </div>\n</ng-container>\n\n<ng-template #skeleton>\n <div class=\"flex w-full gap-2\">\n <div class=\"size-20 rounded-xl bg-tui-base-02\"></div>\n <div class=\"flex grow flex-col gap-2.5 bg-white\">\n <div class=\"h-4 w-full rounded-xl bg-tui-base-02\"></div>\n <div class=\"h-4 w-3/5 rounded-xl bg-tui-base-02\"></div>\n <div class=\"h-4 w-4/5 rounded-xl bg-tui-base-02\"></div>\n </div>\n </div>\n</ng-template>\n" }]
|
|
3878
3878
|
}], ctorParameters: () => [{ type: i1.ScUnitsHelper }, { type: i2$1.TuiPreviewDialogService, decorators: [{
|
|
3879
3879
|
type: Inject,
|
|
3880
3880
|
args: [TuiPreviewDialogService]
|