@salla.sa/twilight-components
Version:
Salla Web Component
94 lines (93 loc) • 3.87 kB
JavaScript
/*!
* Crafted with ❤ by Salla
*/
import { h, Host } from "@stencil/core";
export class SallaOrderEditProductCard {
get productData() {
if (!this.product) {
return {};
}
if (typeof this.product === 'object') {
return this.product;
}
try {
return JSON.parse(this.product);
}
catch (_error) {
return {};
}
}
handleSelectProduct() {
this.orderEditProductSelected.emit({ product: this.productData });
}
render() {
const product = this.productData;
const productName = product?.name || salla.lang.getWithDefault('common.elements.product', 'منتج');
const price = product?.price;
return (h(Host, { key: '9f9278890bd821cf7b1caecdf4484a26273fe407' }, h("button", { key: '6d28490ff098143000fff6543702ba805e997077', type: "button", class: "s-order-edit-product-card", onClick: () => this.handleSelectProduct() }, h("div", { key: 'b7399553a7b79303b8bae8c9b624f460fe761946', class: "s-order-edit-product-card-media" }, product?.image?.url ? (h("img", { src: product.image.url, alt: product.image.alt || productName, class: "s-order-edit-product-card-image" })) : (h("div", { class: "s-order-edit-product-card-placeholder" }, h("i", { class: "sicon-shopping-bag" })))), h("div", { key: '5cd57cf519f5d681116336cc6db8aed3569b761d', class: "s-order-edit-product-card-content" }, h("h3", { key: '51312a3708d95f3d6d654099b25a2a4644c70aaa', class: "s-order-edit-product-card-title" }, productName), price != null && (h("p", { key: 'c09988f616198ae0d527e994e5c55e8b0a01c218', class: "s-order-edit-product-card-price", innerHTML: salla.money(price) }))))));
}
static get is() { return "salla-order-edit-product-card"; }
static get originalStyleUrls() {
return {
"$": ["salla-order-edit-product-card.scss"]
};
}
static get styleUrls() {
return {
"$": ["salla-order-edit-product-card.css"]
};
}
static get properties() {
return {
"product": {
"type": "string",
"attribute": "product",
"mutable": false,
"complexType": {
"original": "Product | string",
"resolved": "Product | string",
"references": {
"Product": {
"location": "import",
"path": "@salla.sa/twilight/types/common",
"id": "../twilight/types/common.d.ts::Product"
}
}
},
"required": false,
"optional": false,
"docs": {
"tags": [],
"text": ""
},
"getter": false,
"setter": false,
"reflect": false
}
};
}
static get events() {
return [{
"method": "orderEditProductSelected",
"name": "orderEditProductSelected",
"bubbles": true,
"cancelable": true,
"composed": true,
"docs": {
"tags": [],
"text": ""
},
"complexType": {
"original": "{\n product: Product;\n }",
"resolved": "{ product: Product; }",
"references": {
"Product": {
"location": "import",
"path": "@salla.sa/twilight/types/common",
"id": "../twilight/types/common.d.ts::Product"
}
}
}
}];
}
}