diff --git a/config/default.json b/config/default.json index 85ec4c02db..80e315b048 100644 --- a/config/default.json +++ b/config/default.json @@ -116,6 +116,7 @@ "products": { "useShortCatalogUrls": false, "useMagentoUrlKeys": false, + "setFirstVarianAsDefaultInURL": false, "configurableChildrenStockPrefetchStatic": false, "configurableChildrenStockPrefetchDynamic": false, "configurableChildrenStockPrefetchStaticPrefetchCount": 8, diff --git a/core/filters/index.js b/core/filters/index.js index 71c89e08f8..f649e07fa5 100644 --- a/core/filters/index.js +++ b/core/filters/index.js @@ -3,11 +3,13 @@ import { htmlDecode } from './html-decode' import { date } from './date' import { capitalize } from './capitalize' import { formatProductMessages } from './product-messages' +import { stripHTML } from './strip-html' export { price, htmlDecode, date, capitalize, - formatProductMessages + formatProductMessages, + stripHTML } diff --git a/core/filters/strip-html/index.js b/core/filters/strip-html/index.js new file mode 100644 index 0000000000..2f6c5f6d29 --- /dev/null +++ b/core/filters/strip-html/index.js @@ -0,0 +1,8 @@ +/** + * Strip HTML tags + * @param {String} html + */ +export function stripHTML (html) { + if (!html) return '' + return html.replace(/<[^>]+>/g, '').trim() +} diff --git a/core/pages/Product.js b/core/pages/Product.js index 9b274101c7..bfb62aad87 100644 --- a/core/pages/Product.js +++ b/core/pages/Product.js @@ -7,7 +7,8 @@ import uniqBy from 'lodash-es/uniqBy' import i18n from 'core/lib/i18n' import config from 'config' import EventBus from 'core/plugins/event-bus' -import { htmlDecode } from 'core/filters/html-decode' +import { htmlDecode, stripHTML } from 'core/filters' +import { currentStoreView } from '@vue-storefront/store/lib/multistore' // Core mixins import Composite from 'core/mixins/composite' @@ -93,6 +94,9 @@ export default { }, isOnCompare () { return !!this.$store.state.compare.items.find(p => p.sku === this.product.sku) + }, + currentStore () { + return currentStoreView() } }, asyncData ({ store, route }) { // this is for SSR purposes to prefetch data @@ -100,7 +104,7 @@ export default { return store.dispatch('product/fetchAsync', { parentSku: route.params.parentSku, childSku: route && route.params && route.params.childSku ? route.params.childSku : null }) }, watch: { - '$route': 'validateRoute' + '$route.params.parentSku': 'validateRoute' }, beforeDestroy () { this.$bus.$off('product-after-removevariant') @@ -127,8 +131,7 @@ export default { this.loading = false this.defaultOfflineImage = this.product.image this.onStateCheck() - this.$bus.$on('filter-changed-product', this.onAfterFilterChanged) - }).catch(err => { + }).catch((err) => { this.loading = false console.error(err) this.$bus.$emit('notification', { @@ -208,7 +211,10 @@ export default { configuration: this.configuration, selectDefaultVariant: true, fallbackToDefaultWhenNoAvailable: false - }).then(selectedVariant => { + }).then((selectedVariant) => { + if (config.products.setFirstVarianAsDefaultInURL) { + this.$router.push({params: { childSku: selectedVariant.sku }}) + } if (!selectedVariant) { if (typeof prevOption !== 'undefined' && prevOption) { this.configuration[filterOption.attribute_code] = prevOption @@ -230,7 +236,7 @@ export default { metaInfo () { return { title: htmlDecode(this.$route.meta.title || this.productName), - meta: this.$route.meta.description ? [{ vmid: 'description', description: htmlDecode(this.$route.meta.description) }] : [] + meta: [{ vmid: 'description', description: this.product.short_description ? stripHTML(htmlDecode(this.product.short_description)) : htmlDecode(stripHTML(this.product.description)) }] } } } diff --git a/core/store/modules/product/actions.js b/core/store/modules/product/actions.js index efa4676ff5..0d8ac5aef0 100644 --- a/core/store/modules/product/actions.js +++ b/core/store/modules/product/actions.js @@ -245,6 +245,9 @@ export default { if (!product.parentSku) { product.parentSku = product.sku } + if (config.products.setFirstVarianAsDefaultInURL && product.hasOwnProperty('configurable_children') && product.configurable_children.length > 0) { + product.sku = product.configurable_children[0].sku + } if (configuration) { let selectedVariant = configureProductAsync(context, { product: product, configuration: configuration, selectDefaultVariant: false }) Object.assign(product, selectedVariant) diff --git a/src/themes/default/components/core/ProductGallery.vue b/src/themes/default/components/core/ProductGallery.vue index 72bd61cdaa..feab9d9d0c 100644 --- a/src/themes/default/components/core/ProductGallery.vue +++ b/src/themes/default/components/core/ProductGallery.vue @@ -40,6 +40,7 @@ class="mw-100 pointer" ref="defaultImage" alt="" + itemprop="image" > @@ -66,6 +67,7 @@ @dblclick="toggleZoom" alt="" data-testid="productGalleryImage" + itemprop="image" > diff --git a/src/themes/default/pages/Home.vue b/src/themes/default/pages/Home.vue index f3c91bb0fa..6581e6dc54 100755 --- a/src/themes/default/pages/Home.vue +++ b/src/themes/default/pages/Home.vue @@ -95,7 +95,7 @@ export default { query: newProductsQuery, size: 8, sort: 'created_at:desc', - includeFields: config.entities.optimize ? config.entities.productList.includeFields : [] + includeFields: config.entities.optimize ? (config.products.setFirstVarianAsDefaultInURL ? config.entities.productListWithChildren.includeFields : config.entities.productList.includeFields) : [] }).then((res) => { if (res) { store.state.homepage.new_collection = res.items @@ -105,7 +105,7 @@ export default { query: coolBagsQuery, size: 4, sort: 'created_at:desc', - includeFields: config.entities.optimize ? config.entities.productList.includeFields : [] + includeFields: config.entities.optimize ? (config.products.setFirstVarianAsDefaultInURL ? config.entities.productListWithChildren.includeFields : config.entities.productList.includeFields) : [] }).then((res) => { if (res) { store.state.homepage.coolbags_collection = res.items diff --git a/src/themes/default/pages/Product.vue b/src/themes/default/pages/Product.vue index 5da09be766..6070bc0410 100644 --- a/src/themes/default/pages/Product.vue +++ b/src/themes/default/pages/Product.vue @@ -1,5 +1,5 @@