From e547510df9f7c8848fe2a91098431cda81fbc499 Mon Sep 17 00:00:00 2001 From: Sanskar Soni Date: Fri, 6 Oct 2023 14:09:20 +0530 Subject: [PATCH 1/2] Implemented: centralized product store selector (#193) --- src/components/Login.ts | 4 +- src/components/ProductStoreSelector.vue | 41 +++++++++++ src/components/index.ts | 1 + src/index.ts | 3 +- src/store/auth.ts | 7 ++ src/store/user.ts | 96 ++++++++++++++++++++++++- 6 files changed, 148 insertions(+), 4 deletions(-) create mode 100644 src/components/ProductStoreSelector.vue diff --git a/src/components/Login.ts b/src/components/Login.ts index 03d97848..68bba62a 100644 --- a/src/components/Login.ts +++ b/src/components/Login.ts @@ -1,6 +1,6 @@ import { defineComponent } from "vue" import { initialiseFirebaseApp } from "../utils/firebase" -import { loginContext as context, useAuthStore, appContext, loginContext, noitificationContext } from "../index" +import { loginContext as context, useAuthStore, useUserStore, appContext, loginContext, noitificationContext } from "../index" import { DateTime } from "luxon" export default defineComponent({ @@ -15,12 +15,14 @@ export default defineComponent({ return { errorMsg: '', authStore: {} as any, + userStore: {} as any, router: {} as any, route: {} as any, } }, async mounted() { this.authStore = useAuthStore() + this.userStore = useUserStore() this.router = appContext.config.globalProperties.$router this.route = appContext.config.globalProperties.$route diff --git a/src/components/ProductStoreSelector.vue b/src/components/ProductStoreSelector.vue new file mode 100644 index 00000000..9dd418d2 --- /dev/null +++ b/src/components/ProductStoreSelector.vue @@ -0,0 +1,41 @@ + + + \ No newline at end of file diff --git a/src/components/index.ts b/src/components/index.ts index beb273ca..569928c9 100644 --- a/src/components/index.ts +++ b/src/components/index.ts @@ -18,5 +18,6 @@ export { default as AppVersionInfo } from './AppVersionInfo.vue'; export { default as LanguageSwitcher } from './LanguageSwitcher.vue'; export { default as OmsInstanceNavigator } from './OmsInstanceNavigator.vue' export { default as ProductIdentifier } from "./ProductIdentifier.vue"; +export { default as ProductStoreSelector } from "./ProductStoreSelector.vue"; export { default as Scanner } from './Scanner.vue'; export { default as ShopifyImg } from './ShopifyImg.vue'; diff --git a/src/index.ts b/src/index.ts index f87fe774..3f7c12a7 100644 --- a/src/index.ts +++ b/src/index.ts @@ -3,7 +3,7 @@ declare var process: any; import { createPinia } from "pinia"; import { useProductIdentificationStore } from "./store/productIdentification"; import { useAuthStore } from "./store/auth"; -import { AppVersionInfo, LanguageSwitcher, OmsInstanceNavigator, ProductIdentifier, Scanner, ShopifyImg } from "./components"; +import { AppVersionInfo, LanguageSwitcher, OmsInstanceNavigator, ProductIdentifier, ProductStoreSelector, Scanner, ShopifyImg } from "./components"; import Login from "./components/Login"; import { goToOms, getProductIdentificationValue } from "./utils"; import { initialiseFirebaseApp } from "./utils/firebase" @@ -46,6 +46,7 @@ export let dxpComponents = { app.component('Login', Login) app.component('OmsInstanceNavigator', OmsInstanceNavigator) app.component('ProductIdentifier', ProductIdentifier) + app.component('ProductStoreSelector', ProductStoreSelector) app.component('Scanner', Scanner) app.component('ShopifyImg', ShopifyImg) diff --git a/src/store/auth.ts b/src/store/auth.ts index d8a8ca8e..df1e537a 100644 --- a/src/store/auth.ts +++ b/src/store/auth.ts @@ -1,3 +1,5 @@ +declare const process: any; + import { defineStore } from "pinia"; import { DateTime } from 'luxon' @@ -14,6 +16,11 @@ export const useAuthStore = defineStore('userAuth', { getters: { getToken: (state) => state.token, getOms: (state) => state.oms, + getBaseUrl: (state) => { + let baseURL = process.env.VUE_APP_BASE_URL; + if (!baseURL) baseURL = state.oms; + return baseURL.startsWith('http') ? baseURL : `https://${baseURL}.hotwax.io/api/`; + }, isAuthenticated: (state) => { let isTokenExpired = false if (state.token.expiration) { diff --git a/src/store/user.ts b/src/store/user.ts index 354f87e0..c0feebd2 100644 --- a/src/store/user.ts +++ b/src/store/user.ts @@ -1,20 +1,112 @@ import { defineStore } from "pinia"; -import { i18n } from "../../src"; +import { appContext, i18n, useAuthStore } from "../../src"; +import { api, client, hasError } from '@hotwax/oms-api' declare let process: any; export const useUserStore = defineStore('user', { state: () => { return { + current: {} as any, + currentEComStore: {} as any, locale: 'en', localeOptions: process.env.VUE_APP_LOCALES ? JSON.parse(process.env.VUE_APP_LOCALES) : { "en": "English" } } }, getters: { + getCurrentEComStore: (state) => state.currentEComStore, getLocale: (state) => state.locale, - getLocaleOptions: (state) => state.localeOptions + getLocaleOptions: (state) => state.localeOptions, + getUserProfile: (state) => state.current }, actions: { + async getEComStores(facilityId: string) { + const authStore = useAuthStore(); + + // If the facilities is not provided, it may be case of user not associated with any facility + if (!facilityId) { + this.current.stores = []; + } + + try { + const params = { + "inputFields": { + "storeName_op": "not-empty", + "facilityId": facilityId + }, + "fieldList": ["productStoreId", "storeName"], + "entityName": "ProductStoreFacilityDetail", + "distinct": "Y", + "noConditionFind": "Y", + "filterByDate": 'Y', + } + const resp = await client({ + url: "performFind", + method: "get", + baseURL: authStore.getBaseUrl, + params, + headers: { + Authorization: 'Bearer ' + authStore.getToken.value, + 'Content-Type': 'application/json' + } + }); + if (hasError(resp) || resp.data.docs.length === 0) { + return Promise.reject(resp.data) + } + this.current.stores = resp.data.docs; + } catch (error: any) { + return Promise.reject(error) + } + }, + async getPreferredStore() { + const authStore = useAuthStore(); + let preferredStore = {} as any; + + // Handling case if stores are not present, it may be case of user not associated with any facility + if(this.current.stores.length){ + preferredStore = this.current.stores[0]; + let preferredStoreId = ''; + + try { + const resp = await client({ + url: "service/getUserPreference", + method: "post", + data: { + 'userPrefTypeId': 'SELECTED_BRAND' + }, + baseURL: authStore.getBaseUrl, + headers: { + Authorization: 'Bearer ' + authStore.getToken.value, + 'Content-Type': 'application/json' + } + }); + if (hasError(resp)) { + return Promise.reject(resp.data); + } + preferredStoreId = resp.data.userPrefValue; + } catch (error: any) { + return Promise.reject(error) + } + + if (preferredStoreId) { + const store = this.current.stores.find((store: any) => store.productStoreId === preferredStoreId); + store && (preferredStore = store) + } + } + + this.currentEComStore = preferredStore; + }, + async setEComStore(payload: any) { + await api({ + url: "service/setUserPreference", + method: "post", + data: { + 'userPrefTypeId': 'SELECTED_BRAND', + 'userPrefValue': payload.eComStore.productStoreId + } + }); + this.currentEComStore = payload.eComStore; + }, setLocale(payload: string) { // update locale in state and globally i18n.global.locale.value = payload From 0ed0c54bbca5a44c1823c4433c3fa2236a08b396 Mon Sep 17 00:00:00 2001 From: Sanskar Soni Date: Fri, 6 Oct 2023 14:34:02 +0530 Subject: [PATCH 2/2] Improved: code and indentation (#193) --- src/components/Login.ts | 4 +--- src/components/ProductStoreSelector.vue | 3 +-- src/store/user.ts | 8 ++++---- 3 files changed, 6 insertions(+), 9 deletions(-) diff --git a/src/components/Login.ts b/src/components/Login.ts index 68bba62a..03d97848 100644 --- a/src/components/Login.ts +++ b/src/components/Login.ts @@ -1,6 +1,6 @@ import { defineComponent } from "vue" import { initialiseFirebaseApp } from "../utils/firebase" -import { loginContext as context, useAuthStore, useUserStore, appContext, loginContext, noitificationContext } from "../index" +import { loginContext as context, useAuthStore, appContext, loginContext, noitificationContext } from "../index" import { DateTime } from "luxon" export default defineComponent({ @@ -15,14 +15,12 @@ export default defineComponent({ return { errorMsg: '', authStore: {} as any, - userStore: {} as any, router: {} as any, route: {} as any, } }, async mounted() { this.authStore = useAuthStore() - this.userStore = useUserStore() this.router = appContext.config.globalProperties.$router this.route = appContext.config.globalProperties.$route diff --git a/src/components/ProductStoreSelector.vue b/src/components/ProductStoreSelector.vue index 9dd418d2..b35e255b 100644 --- a/src/components/ProductStoreSelector.vue +++ b/src/components/ProductStoreSelector.vue @@ -15,8 +15,7 @@ {{ $t("Select store") }} - + {{ store.storeName }} diff --git a/src/store/user.ts b/src/store/user.ts index c0feebd2..6a379e21 100644 --- a/src/store/user.ts +++ b/src/store/user.ts @@ -1,5 +1,5 @@ import { defineStore } from "pinia"; -import { appContext, i18n, useAuthStore } from "../../src"; +import { i18n, useAuthStore } from "../../src"; import { api, client, hasError } from '@hotwax/oms-api' declare let process: any; @@ -22,8 +22,8 @@ export const useUserStore = defineStore('user', { actions: { async getEComStores(facilityId: string) { const authStore = useAuthStore(); - - // If the facilities is not provided, it may be case of user not associated with any facility + + // If the facilityId is undefined, it may be case of user not associated with any facility if (!facilityId) { this.current.stores = []; } @@ -63,7 +63,7 @@ export const useUserStore = defineStore('user', { let preferredStore = {} as any; // Handling case if stores are not present, it may be case of user not associated with any facility - if(this.current.stores.length){ + if (this.current.stores.length) { preferredStore = this.current.stores[0]; let preferredStoreId = '';