3.0.0 • Published 19 days ago
@scayle/omnichannel-nuxt v3.0.0
Omnichannel
This is the basis for setting up a new Omnichannel Add On based on Nuxt. It provides a reusable composable, that can be used in the actual shop project.
Getting started
To start working with @scayle/omnichannel-nuxt
, make sure to
register it as a module in your nuxt.config.ts file:
Nuxt 2
import { NuxtConfig } from '@nuxt/types'
const config: NuxtConfig & { storefront: ModuleOptions } = {
// ...
modules: [
// ...
[
'@scayle/omnichannel-nuxt/dist/module',
{
host: environment.OMNICHANNEL_API_HOST,
token: environment.OMNICHANNEL_API_TOKEN,
},
],
],
// ...
}
export default config
Nuxt 3
export default defineNuxtConfig({
modules: ['@scayle/omnichannel-nuxt/module'],
runtimeConfig: {
/** Omnichannel runtime configuration */
omnichannel: {
apiHost: '', // Override: NUXT_OMNICHANNEL_API_HOST
apiToken: '', // Override: NUXT_OMNICHANNEL_API_TOKEN
},
},
})
Architecture
The Omnichannel Add-On package provides useStoreLocator
composable,
which can be used to call the following methods:
refreshStores
to getstoresData
based on provided addressrefreshVariantStores
to getvariantStoresData
based on provided store IDrefreshStoreVariant
to getstoreVariantData
based on provided store ID and variant ID
List of composables
note When using Nuxt 3, composables are automatically registered and do not need to be imported explicitly. /note
useStoreLocator
Getting storesData
based on a provided address
Example:
import { useStoreLocator } from '@scayle/omnichannel-nuxt'
const { storesData, refreshStores } = useStoreLocator('useStoreLocator', [
'openingTimes',
])
const address = 'Hamburg'
await refreshStores(address)
Getting variantStoresData
based on a provided address
Example:
import { useStoreLocator } from '@scayle/omnichannel-nuxt'
const { variantStoresData, refreshVariantStores } = useStoreLocator(
'useStoreLocator',
['openingTimes'],
)
const address = 'Hamburg'
const storeId = 12
await refreshVariantStores(storeId, { address: address })
Getting storeVariantData
based on a provided store ID and variant ID
Example:
import { useStoreLocator } from '@scayle/omnichannel-nuxt'
const { storeVariantData, refreshStoreVariant } = useStoreLocator(
'useStoreLocator',
['openingTimes'],
)
const variantId = 1
const storeId = 12
await refreshStoreVariant(variantId, storeId)