diff --git a/config/default.json b/config/default.json index 8df258d435..9c461e7731 100644 --- a/config/default.json +++ b/config/default.json @@ -26,7 +26,7 @@ "index": "vue_storefront_catalog_de" }, "tax": { - "sourcePriceIncludesTax": false, + "sourcePriceIncludesTax": false, "defaultCountry": "DE", "defaultRegion": "", "calculateServerSide": true @@ -53,7 +53,7 @@ "index": "vue_storefront_catalog_it" }, "tax": { - "sourcePriceIncludesTax": false, + "sourcePriceIncludesTax": false, "defaultCountry": "IT", "defaultRegion": "", "calculateServerSide": true @@ -156,9 +156,9 @@ "attributes": "INDEXEDDB", "products": "INDEXEDDB", "elasticCache": "INDEXEDDB", - "claims": "LOCALSTORAGE", - "compare": "INDEXEDDB", - "syncTasks": "INDEXEDDB", + "claims": "LOCALSTORAGE", + "compare": "INDEXEDDB", + "syncTasks": "INDEXEDDB", "newsletterPreferences": "INDEXEDDB", "ordersHistory": "INDEXEDDB", "checkoutFieldValues": "LOCALSTORAGE" @@ -217,6 +217,7 @@ "api_key": "my_example_api_key" }, "cms": { - "endpoint": "http://localhost:8080/api/ext/cms-data/cms{{type}}/{{cmsId}}" + "endpoint": "http://localhost:8080/api/ext/cms-data/cms{{type}}/{{cmsId}}", + "endpointIdentifier": "http://localhost:8080/api/ext/cms-data/cms{{type}}Identifier/{{cmsIdentifier}}/storeId/{{storeId}}" } } diff --git a/core/api/user/signIn.js b/core/api/user/signIn.js index 1c2c92841e..c78fb17cdc 100644 --- a/core/api/user/signIn.js +++ b/core/api/user/signIn.js @@ -1,6 +1,6 @@ export const signIn = { methods: { - signIn(username, password, onSuccess, onError) { + signIn (username, password, onSuccess, onError) { this.$store.dispatch('user/login', { username: this.username, password: this.password }) .then((result) => { result.code !== 200 ? this.onError() : this.onSuccess() @@ -11,4 +11,4 @@ export const signIn = { }) } } -} \ No newline at end of file +} diff --git a/core/api/user/signOut.js b/core/api/user/signOut.js index 17af0a7a64..cd7ceca2fc 100644 --- a/core/api/user/signOut.js +++ b/core/api/user/signOut.js @@ -1,3 +1,3 @@ export const signOut = { signOut () {} -} \ No newline at end of file +} diff --git a/core/scripts/installer.js b/core/scripts/installer.js index 0390473660..9a301b02a0 100644 --- a/core/scripts/installer.js +++ b/core/scripts/installer.js @@ -373,6 +373,7 @@ class Storefront extends Abstract { config.mailchimp.endpoint = `${backendPath}/api/ext/mailchimp-subscribe/subscribe` config.images.baseUrl = this.answers.images_endpoint config.cms.endpoint = `${backendPath}/api/ext/cms-data/cms{{type}}/{{cmsId}}` + config.cms.endpointIdentifier = `${backendPath}/api/ext/cms-data/cms{{type}}Identifier/{{cmsIdentifier}}/storeId/{{storeId}}` config.install = { is_local_backend: Abstract.wasLocalBackendInstalled, diff --git a/src/extensions/cms/README.md b/src/extensions/cms/README.md index 751826ffeb..6136048fef 100644 --- a/src/extensions/cms/README.md +++ b/src/extensions/cms/README.md @@ -1,6 +1,6 @@ # CMS Magento 2 data extension -To display cms data: +To display Cms data: - install `snowdog/module-cms-api` composer module in your Magento 2 instance, [snowdog/module-cms-api on github](https://github.com/SnowdogApps/magento2-cms-api) - make sure that in `vue-storefront-api` repo the `cms-data` extension is installed @@ -9,29 +9,45 @@ To display Cms Block import CmsData component and use it in template: `import CmsData from 'src/extensions/cms/components/CmsData'` +we have to options to get Cms Block data: +1. by Magento `identifier`: +`` +where `contact-us-info` is a Cms Block `identifier` from Magento 2 instance + +this option handles different `Store Views` - if multistore is enabled, it takes Cms Block by current Store View, if it's disabled, it set default Store View (`0`) + +2. by Magento id `` -where `5` is a cms block identifier from Magento 2 instance +where `5` is a Magento id of Cms Block. +It doesn't handle differents Store Views so please use it only when multistore it's enabled/ ## Cms Page To display Cms Page: 1. Cms page content like a block -- in custom theme create new page with custom route -- import CmsData component and use it in template: +* in custom theme create new page with custom route +* import CmsData component and use it in template: `import CmsData from 'src/extensions/cms/components/CmsData'` +call Cms Page like a Block using either Magento `identifier`: +`` + +or Magento `id` `` where `5` is a cms page identifier from Magento 2 instance +Like Cms Block, the Cms Page by `identifier` handles different Store Views, Cms Page by `id` handles only Default Store View/ + 2. Cms page content as a page component: -- in custom theme `themes//router/index.js` import `CmsData` component, add custom route and define props: `{id: :pageId, type: 'Page'}`, example: +- in custom theme `themes//router/index.js` import `CmsData` component, add custom route and define props: `{identifier: :pageIdentifier, type: 'Page', sync: true}`, example: ``` import CmsData from 'src/extensions/cms/components/CmsData' const routes = [ // ... theme routes - { name: 'custom-cms-page', path: '/custom-cms-page', component: CmsData, props: {id: 4, type: 'Page'} } + { name: 'cms-page-sync', path: '/cms-page-sync', component: CmsData, props: {identifier: 'about-us', type: 'Page', sync: true} } ] ``` -- create custom page and call the `CmsData` component there: -`` +Complete examples of usage and implementation you can find in Default theme: +1. `/cms-page-sync`, `src/themes/default/router/index.js` +2. `/custom-cms-page`, `src/themes/default/router/index.js`, `src/themes/default/pages/CustomCmsPage.vue` diff --git a/src/extensions/cms/components/CmsData.vue b/src/extensions/cms/components/CmsData.vue index 36e7958ecd..960376a698 100644 --- a/src/extensions/cms/components/CmsData.vue +++ b/src/extensions/cms/components/CmsData.vue @@ -1,32 +1,81 @@