diff --git a/package-lock.json b/package-lock.json index ba9f72af..1a45543b 100644 --- a/package-lock.json +++ b/package-lock.json @@ -15,7 +15,7 @@ "@casl/vue": "^2.2.0", "@hotwax/app-version-info": "^1.0.0", "@hotwax/apps-theme": "^1.1.0", - "@hotwax/dxp-components": "1.7.5", + "@hotwax/dxp-components": "1.8.0", "@hotwax/oms-api": "^1.10.0", "@ionic/core": "6.7.5", "@ionic/vue": "6.7.5", @@ -2946,18 +2946,20 @@ "integrity": "sha512-yokhlpG+eUEao19vaUtCOC5YwcYTb5sf5joGVH17mbb5B1hM4G+P4ZiGiFw2AMmZBKgu94DtHwSyjtdsf4bHug==" }, "node_modules/@hotwax/dxp-components": { - "version": "1.7.5", - "resolved": "https://registry.npmjs.org/@hotwax/dxp-components/-/dxp-components-1.7.5.tgz", - "integrity": "sha512-1mkomu1JzEck7fwZwb8TxzUSdooWIfNj+uuDFhxrBPnrZWwUbjKQqr2mIv8unV4HA7qoqDIyoAKFDSeEaX1HNA==", + "version": "1.8.0", + "resolved": "https://registry.npmjs.org/@hotwax/dxp-components/-/dxp-components-1.8.0.tgz", + "integrity": "sha512-391++6B7oNxKqaWVGwpDhf1vRACdObfu5K7zxy60ZGknQ1bY11da+RSVk9/90IDkCg32mLbBP2I+GQ29hlG10g==", "dependencies": { "@hotwax/oms-api": "^1.8.1", "@ionic/core": "^6.7.5", "@ionic/vue": "^6.7.5", + "@types/vue-barcode-reader": "^0.0.0", "firebase": "^10.3.1", "luxon": "^3.3.0", "pinia": "2.0.36", "pinia-plugin-persistedstate": "^3.1.0", "vue": "^3.3.4", + "vue-barcode-reader": "^1.0.3", "vue-i18n": "^9.2.2" } }, @@ -4670,6 +4672,65 @@ "source-map": "^0.6.1" } }, + "node_modules/@types/vue-barcode-reader": { + "version": "0.0.0", + "resolved": "https://registry.npmjs.org/@types/vue-barcode-reader/-/vue-barcode-reader-0.0.0.tgz", + "integrity": "sha512-yngQhd35qGjCxMXWIqsAtF7qmxe0qUYRVd9qW5I/CcRPWDdBpqVkHnQSh6ro5BIBl3NQ3ppky7kMKS4pr+XwCQ==", + "dependencies": { + "vue": "^2.0.0" + } + }, + "node_modules/@types/vue-barcode-reader/node_modules/@vue/compiler-sfc": { + "version": "2.7.14", + "resolved": "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-2.7.14.tgz", + "integrity": "sha512-aNmNHyLPsw+sVvlQFQ2/8sjNuLtK54TC6cuKnVzAY93ks4ZBrvwQSnkkIh7bsbNhum5hJBS00wSDipQ937f5DA==", + "dependencies": { + "@babel/parser": "^7.18.4", + "postcss": "^8.4.14", + "source-map": "^0.6.1" + } + }, + "node_modules/@types/vue-barcode-reader/node_modules/picocolors": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.0.0.tgz", + "integrity": "sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ==" + }, + "node_modules/@types/vue-barcode-reader/node_modules/postcss": { + "version": "8.4.31", + "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.31.tgz", + "integrity": "sha512-PS08Iboia9mts/2ygV3eLpY5ghnUcfLV/EXTOW1E2qYxJKGGBUtNjN76FYHnMs36RmARn41bC0AZmn+rR0OVpQ==", + "funding": [ + { + "type": "opencollective", + "url": "https://opencollective.com/postcss/" + }, + { + "type": "tidelift", + "url": "https://tidelift.com/funding/github/npm/postcss" + }, + { + "type": "github", + "url": "https://github.com/sponsors/ai" + } + ], + "dependencies": { + "nanoid": "^3.3.6", + "picocolors": "^1.0.0", + "source-map-js": "^1.0.2" + }, + "engines": { + "node": "^10 || ^12 || >=14" + } + }, + "node_modules/@types/vue-barcode-reader/node_modules/vue": { + "version": "2.7.14", + "resolved": "https://registry.npmjs.org/vue/-/vue-2.7.14.tgz", + "integrity": "sha512-b2qkFyOM0kwqWFuQmgd4o+uHGU7T+2z3T+WQp8UBjADfEv2n4FEMffzBmCKNP0IGzOEEfYjvtcC62xaSKeQDrQ==", + "dependencies": { + "@vue/compiler-sfc": "2.7.14", + "csstype": "^3.1.0" + } + }, "node_modules/@types/webpack": { "version": "4.41.33", "resolved": "https://registry.npmjs.org/@types/webpack/-/webpack-4.41.33.tgz", @@ -9406,6 +9467,26 @@ "integrity": "sha512-NuHqBY1PB/D8xU6s/thBgOAiAP7HOYDQ32+BFZILJ8ivkUkAHQnWfn6WhL79Owj1qmUnoN/YPhktdIoucipkAQ==", "dev": true }, + "node_modules/@zxing/library": { + "version": "0.19.3", + "resolved": "https://registry.npmjs.org/@zxing/library/-/library-0.19.3.tgz", + "integrity": "sha512-RUv5svewpDoD0ymXleOP8yVTO5BLkR0zn5coGC/Vs1671u0OBJ4xdtR8WVWf08OcvrieEMHdSfQY3ZKtqII/hg==", + "dependencies": { + "ts-custom-error": "^3.2.1" + }, + "engines": { + "node": ">= 10.4.0" + }, + "optionalDependencies": { + "@zxing/text-encoding": "~0.9.0" + } + }, + "node_modules/@zxing/text-encoding": { + "version": "0.9.0", + "resolved": "https://registry.npmjs.org/@zxing/text-encoding/-/text-encoding-0.9.0.tgz", + "integrity": "sha512-U/4aVJ2mxI0aDNI8Uq0wEhMgY+u4CNtEb0om3+y3+niDAsoTCOB33UF0sxpzqzdqXLqmvc+vZyAt4O8pPdfkwA==", + "optional": true + }, "node_modules/abab": { "version": "2.0.6", "resolved": "https://registry.npmjs.org/abab/-/abab-2.0.6.tgz", @@ -25175,9 +25256,15 @@ "optional": true }, "node_modules/nanoid": { - "version": "3.3.4", - "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.4.tgz", - "integrity": "sha512-MqBkQh/OHTS2egovRtLk45wEyNXwF+cokD+1YPf9u5VfJiRdAiRwB2froX5Co9Rh20xs4siNPm8naNotSD6RBw==", + "version": "3.3.6", + "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.6.tgz", + "integrity": "sha512-BGcqMMJuToF7i1rt+2PWSNVnWIkGCU78jBG3RxO/bZlnZPK2Cmi2QaffxGO/2RvWi9sL+FAiRiXMgsyxQ1DIDA==", + "funding": [ + { + "type": "github", + "url": "https://github.com/sponsors/ai" + } + ], "bin": { "nanoid": "bin/nanoid.cjs" }, @@ -30546,6 +30633,14 @@ "integrity": "sha512-c3zayb8/kWWpycWYg87P71E1S1ZL6b6IJxfb5fvsUgsf0S2MVGaDhDXXjDMpdCpfWXqptc+4mXwmiy1ypXqRAA==", "dev": true }, + "node_modules/ts-custom-error": { + "version": "3.3.1", + "resolved": "https://registry.npmjs.org/ts-custom-error/-/ts-custom-error-3.3.1.tgz", + "integrity": "sha512-5OX1tzOjxWEgsr/YEUWSuPrQ00deKLh6D7OTWcvNHm12/7QPyRh8SYpyWvA4IZv8H/+GQWQEh/kwo95Q9OVW1A==", + "engines": { + "node": ">=14.0.0" + } + }, "node_modules/ts-jest": { "version": "28.0.8", "resolved": "https://registry.npmjs.org/ts-jest/-/ts-jest-28.0.8.tgz", @@ -31381,6 +31476,14 @@ "@vue/shared": "3.3.4" } }, + "node_modules/vue-barcode-reader": { + "version": "1.0.3", + "resolved": "https://registry.npmjs.org/vue-barcode-reader/-/vue-barcode-reader-1.0.3.tgz", + "integrity": "sha512-z4mv7+ai/8vECppBTb00tHnyFMMx6W1rAaQe+v214ihoaWK9iGrn8ZZsmgSxf3lwnrtGaibLdkonTtMrGsO+dA==", + "dependencies": { + "@zxing/library": "^0.19.1" + } + }, "node_modules/vue-cli-plugin-i18n": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/vue-cli-plugin-i18n/-/vue-cli-plugin-i18n-1.0.1.tgz", @@ -36457,18 +36560,20 @@ "integrity": "sha512-yokhlpG+eUEao19vaUtCOC5YwcYTb5sf5joGVH17mbb5B1hM4G+P4ZiGiFw2AMmZBKgu94DtHwSyjtdsf4bHug==" }, "@hotwax/dxp-components": { - "version": "1.7.5", - "resolved": "https://registry.npmjs.org/@hotwax/dxp-components/-/dxp-components-1.7.5.tgz", - "integrity": "sha512-1mkomu1JzEck7fwZwb8TxzUSdooWIfNj+uuDFhxrBPnrZWwUbjKQqr2mIv8unV4HA7qoqDIyoAKFDSeEaX1HNA==", + "version": "1.8.0", + "resolved": "https://registry.npmjs.org/@hotwax/dxp-components/-/dxp-components-1.8.0.tgz", + "integrity": "sha512-391++6B7oNxKqaWVGwpDhf1vRACdObfu5K7zxy60ZGknQ1bY11da+RSVk9/90IDkCg32mLbBP2I+GQ29hlG10g==", "requires": { "@hotwax/oms-api": "^1.8.1", "@ionic/core": "^6.7.5", "@ionic/vue": "^6.7.5", + "@types/vue-barcode-reader": "^0.0.0", "firebase": "^10.3.1", "luxon": "^3.3.0", "pinia": "2.0.36", "pinia-plugin-persistedstate": "^3.1.0", "vue": "^3.3.4", + "vue-barcode-reader": "^1.0.3", "vue-i18n": "^9.2.2" }, "dependencies": { @@ -37876,6 +37981,50 @@ "source-map": "^0.6.1" } }, + "@types/vue-barcode-reader": { + "version": "0.0.0", + "resolved": "https://registry.npmjs.org/@types/vue-barcode-reader/-/vue-barcode-reader-0.0.0.tgz", + "integrity": "sha512-yngQhd35qGjCxMXWIqsAtF7qmxe0qUYRVd9qW5I/CcRPWDdBpqVkHnQSh6ro5BIBl3NQ3ppky7kMKS4pr+XwCQ==", + "requires": { + "vue": "^2.0.0" + }, + "dependencies": { + "@vue/compiler-sfc": { + "version": "2.7.14", + "resolved": "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-2.7.14.tgz", + "integrity": "sha512-aNmNHyLPsw+sVvlQFQ2/8sjNuLtK54TC6cuKnVzAY93ks4ZBrvwQSnkkIh7bsbNhum5hJBS00wSDipQ937f5DA==", + "requires": { + "@babel/parser": "^7.18.4", + "postcss": "^8.4.14", + "source-map": "^0.6.1" + } + }, + "picocolors": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.0.0.tgz", + "integrity": "sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ==" + }, + "postcss": { + "version": "8.4.31", + "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.31.tgz", + "integrity": "sha512-PS08Iboia9mts/2ygV3eLpY5ghnUcfLV/EXTOW1E2qYxJKGGBUtNjN76FYHnMs36RmARn41bC0AZmn+rR0OVpQ==", + "requires": { + "nanoid": "^3.3.6", + "picocolors": "^1.0.0", + "source-map-js": "^1.0.2" + } + }, + "vue": { + "version": "2.7.14", + "resolved": "https://registry.npmjs.org/vue/-/vue-2.7.14.tgz", + "integrity": "sha512-b2qkFyOM0kwqWFuQmgd4o+uHGU7T+2z3T+WQp8UBjADfEv2n4FEMffzBmCKNP0IGzOEEfYjvtcC62xaSKeQDrQ==", + "requires": { + "@vue/compiler-sfc": "2.7.14", + "csstype": "^3.1.0" + } + } + } + }, "@types/webpack": { "version": "4.41.33", "resolved": "https://registry.npmjs.org/@types/webpack/-/webpack-4.41.33.tgz", @@ -41664,6 +41813,21 @@ "integrity": "sha512-NuHqBY1PB/D8xU6s/thBgOAiAP7HOYDQ32+BFZILJ8ivkUkAHQnWfn6WhL79Owj1qmUnoN/YPhktdIoucipkAQ==", "dev": true }, + "@zxing/library": { + "version": "0.19.3", + "resolved": "https://registry.npmjs.org/@zxing/library/-/library-0.19.3.tgz", + "integrity": "sha512-RUv5svewpDoD0ymXleOP8yVTO5BLkR0zn5coGC/Vs1671u0OBJ4xdtR8WVWf08OcvrieEMHdSfQY3ZKtqII/hg==", + "requires": { + "@zxing/text-encoding": "~0.9.0", + "ts-custom-error": "^3.2.1" + } + }, + "@zxing/text-encoding": { + "version": "0.9.0", + "resolved": "https://registry.npmjs.org/@zxing/text-encoding/-/text-encoding-0.9.0.tgz", + "integrity": "sha512-U/4aVJ2mxI0aDNI8Uq0wEhMgY+u4CNtEb0om3+y3+niDAsoTCOB33UF0sxpzqzdqXLqmvc+vZyAt4O8pPdfkwA==", + "optional": true + }, "abab": { "version": "2.0.6", "resolved": "https://registry.npmjs.org/abab/-/abab-2.0.6.tgz", @@ -54044,9 +54208,9 @@ "optional": true }, "nanoid": { - "version": "3.3.4", - "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.4.tgz", - "integrity": "sha512-MqBkQh/OHTS2egovRtLk45wEyNXwF+cokD+1YPf9u5VfJiRdAiRwB2froX5Co9Rh20xs4siNPm8naNotSD6RBw==" + "version": "3.3.6", + "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.6.tgz", + "integrity": "sha512-BGcqMMJuToF7i1rt+2PWSNVnWIkGCU78jBG3RxO/bZlnZPK2Cmi2QaffxGO/2RvWi9sL+FAiRiXMgsyxQ1DIDA==" }, "nanomatch": { "version": "1.2.13", @@ -58376,6 +58540,11 @@ "integrity": "sha512-c3zayb8/kWWpycWYg87P71E1S1ZL6b6IJxfb5fvsUgsf0S2MVGaDhDXXjDMpdCpfWXqptc+4mXwmiy1ypXqRAA==", "dev": true }, + "ts-custom-error": { + "version": "3.3.1", + "resolved": "https://registry.npmjs.org/ts-custom-error/-/ts-custom-error-3.3.1.tgz", + "integrity": "sha512-5OX1tzOjxWEgsr/YEUWSuPrQ00deKLh6D7OTWcvNHm12/7QPyRh8SYpyWvA4IZv8H/+GQWQEh/kwo95Q9OVW1A==" + }, "ts-jest": { "version": "28.0.8", "resolved": "https://registry.npmjs.org/ts-jest/-/ts-jest-28.0.8.tgz", @@ -59021,6 +59190,14 @@ "@vue/shared": "3.3.4" } }, + "vue-barcode-reader": { + "version": "1.0.3", + "resolved": "https://registry.npmjs.org/vue-barcode-reader/-/vue-barcode-reader-1.0.3.tgz", + "integrity": "sha512-z4mv7+ai/8vECppBTb00tHnyFMMx6W1rAaQe+v214ihoaWK9iGrn8ZZsmgSxf3lwnrtGaibLdkonTtMrGsO+dA==", + "requires": { + "@zxing/library": "^0.19.1" + } + }, "vue-cli-plugin-i18n": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/vue-cli-plugin-i18n/-/vue-cli-plugin-i18n-1.0.1.tgz", diff --git a/package.json b/package.json index fd011347..aced8cc8 100644 --- a/package.json +++ b/package.json @@ -19,7 +19,7 @@ "@casl/vue": "^2.2.0", "@hotwax/app-version-info": "^1.0.0", "@hotwax/apps-theme": "^1.1.0", - "@hotwax/dxp-components": "1.7.5", + "@hotwax/dxp-components": "1.8.0", "@hotwax/oms-api": "^1.10.0", "@ionic/core": "6.7.5", "@ionic/vue": "6.7.5", diff --git a/src/App.vue b/src/App.vue index a7e43f2f..41bf77b5 100644 --- a/src/App.vue +++ b/src/App.vue @@ -16,6 +16,7 @@ import { mapGetters, useStore } from 'vuex'; import { Settings } from 'luxon' import Menu from '@/components/Menu.vue'; import { initialise, resetConfig } from '@/adapter' +import { useProductIdentificationStore } from '@hotwax/dxp-components'; export default defineComponent({ name: 'App', @@ -104,6 +105,10 @@ export default defineComponent({ const defaultAliasInstanceUrl = this.alias[this.defaultAlias]; this.store.dispatch("user/setUserInstanceUrl", defaultAliasInstanceUrl); } + + // Get product identification from api using dxp-component + await useProductIdentificationStore().getIdentificationPref(this.eComStore?.productStoreId) + .catch((error) => console.error(error)); }, unmounted() { emitter.off('presentLoader', this.presentLoader); diff --git a/src/adapter/index.ts b/src/adapter/index.ts index 23716e29..176beb4d 100644 --- a/src/adapter/index.ts +++ b/src/adapter/index.ts @@ -1,13 +1,15 @@ -import { api, client, getConfig, init, initialise, logout, resetConfig, updateInstanceUrl, updateToken } from '@hotwax/oms-api' +import { api, client, getConfig, getProductIdentificationPref, init, initialise, logout, resetConfig, setProductIdentificationPref, updateInstanceUrl, updateToken } from '@hotwax/oms-api' export { api, client, getConfig, + getProductIdentificationPref, init, initialise, logout, resetConfig, + setProductIdentificationPref, updateInstanceUrl, updateToken } \ No newline at end of file diff --git a/src/main.ts b/src/main.ts index f9095c42..f458f0ab 100644 --- a/src/main.ts +++ b/src/main.ts @@ -35,7 +35,7 @@ import permissionRules from '@/authorization/Rules'; import permissionActions from '@/authorization/Actions'; import { dxpComponents } from '@hotwax/dxp-components' import { login, logout, loader } from './user-utils'; -import { getConfig, initialise } from '@/adapter' +import { getConfig, getProductIdentificationPref, initialise, setProductIdentificationPref } from '@/adapter' const app = createApp(App) @@ -59,7 +59,9 @@ const app = createApp(App) loader, appLoginUrl: process.env.VUE_APP_LOGIN_URL as string, getConfig, - initialise + getProductIdentificationPref, + initialise, + setProductIdentificationPref }); // Filters are removed in Vue 3 and global filter introduced https://v3.vuejs.org/guide/migration/filters.html#global-filters diff --git a/src/store/modules/user/actions.ts b/src/store/modules/user/actions.ts index 7620395f..9849ee6e 100644 --- a/src/store/modules/user/actions.ts +++ b/src/store/modules/user/actions.ts @@ -14,7 +14,7 @@ import { setPermissions } from '@/authorization' import { logout, updateInstanceUrl, updateToken, resetConfig } from '@/adapter' -import { useAuthStore } from '@hotwax/dxp-components' +import { useAuthStore, useProductIdentificationStore } from '@hotwax/dxp-components' import emitter from '@/event-bus' @@ -67,6 +67,11 @@ const actions: ActionTree = { const store = userProfile.stores.find((store: any) => store.productStoreId === preferredStoreId); store && (preferredStore = store) } + + // Get product identification from api using dxp-component + await useProductIdentificationStore().getIdentificationPref(preferredStoreId ? preferredStoreId : preferredStore.productStoreId) + .catch((error) => console.error(error)); + // prodCatalogId will be used getting the products instead of productStoreIds as the productStoreIds is tokenized // For STORE, the results will have X_STORE results as well preferredStore.prodCatalogId = (await UserService.getEcommerceCatalog(token, preferredStore.productStoreId))?.prodCatalogId; @@ -159,6 +164,10 @@ const actions: ActionTree = { 'userPrefTypeId': 'SELECTED_BRAND', 'userPrefValue': productStore.productStoreId }); + + // Get product identification from api using dxp-component + await useProductIdentificationStore().getIdentificationPref(productStore.productStoreId) + .catch((error) => console.error(error)); }, /** diff --git a/src/views/SelectProduct.vue b/src/views/SelectProduct.vue index a9f92793..18768033 100644 --- a/src/views/SelectProduct.vue +++ b/src/views/SelectProduct.vue @@ -123,7 +123,7 @@ - {{ variant.productName }} + {{ getProductIdentificationValue(productIdentificationPref.primaryId, variant) ? getProductIdentificationValue(productIdentificationPref.primaryId, variant) : variant.productName}}

{{ $t("Color") }}: {{ variant.color }}

{{ $t("Size") }}: {{ variant.size }}

@@ -193,7 +193,7 @@ import { IonInfiniteScroll, IonInfiniteScrollContent } from '@ionic/vue'; -import { defineComponent } from 'vue'; +import { computed, defineComponent } from 'vue'; import { arrowForwardOutline, downloadOutline, filterOutline, saveOutline, pricetagOutline, closeCircle, addCircleOutline, albumsOutline, warningOutline } from 'ionicons/icons'; import { useRouter } from 'vue-router'; import { mapGetters, useStore } from 'vuex'; @@ -205,6 +205,7 @@ import { JobService } from '@/services/JobService'; import { DateTime } from 'luxon'; import { Actions, hasPermission } from '@/authorization' import emitter from '@/event-bus'; +import { getProductIdentificationValue, useProductIdentificationStore } from '@hotwax/dxp-components'; export default defineComponent({ name: 'SelectProduct', @@ -532,12 +533,15 @@ export default defineComponent({ setup() { const router = useRouter(); const store = useStore(); + const productIdentificationStore = useProductIdentificationStore(); + let productIdentificationPref = computed(() => productIdentificationStore.getProductIdentificationPref) return { Actions, arrowForwardOutline, downloadOutline, filterOutline, + getProductIdentificationValue, hasPermission, router, saveOutline, @@ -546,7 +550,8 @@ export default defineComponent({ closeCircle, addCircleOutline, albumsOutline, - warningOutline + productIdentificationPref, + warningOutline, }; }, }); diff --git a/src/views/Settings.vue b/src/views/Settings.vue index 74ee1a8f..c7f4a43b 100644 --- a/src/views/Settings.vue +++ b/src/views/Settings.vue @@ -66,6 +66,8 @@

{{ "Built: " + getDateTime(appInfo.builtTime) }}

+ +