wbuezas
/
hedera-web-mindshore
forked from verdnatura/hedera-web
0
1
Fork 0
Code Pull Requests Activity

Update lang

This commit is contained in:
William Buezas 2024-10-07 17:38:39 -03:00
parent c9812cd320
commit 4c041f42b2
6 changed files with 50 additions and 41 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
src/layouts/MainLayout.vue
View File

@ -13,8 +13,13 @@ const appStore = useAppStore();
const refreshContentKey = ref(0);
const { mainUser, supplantedUser } = storeToRefs(userStore);
const { title, subtitle, useRightDrawer, rightDrawerOpen, filteredMenuItems } =
storeToRefs(appStore);
const {
menuTitle,
subtitle,
useRightDrawer,
rightDrawerOpen,
filteredMenuItems
} = storeToRefs(appStore);
const actions = ref(null);
const leftDrawerOpen = ref(false);
@ -53,7 +58,7 @@ const logoutSupplantedUser = async () => {
@click="toggleLeftDrawer"
/>
<QToolbarTitle>
{{ title }}
{{ menuTitle }}
<div v-if="subtitle" class="subtitle text-caption">
{{ subtitle }}
</div>

13
src/pages/Account/AccountConfig.vue
View File

@ -57,6 +57,15 @@ const formatMailData = data => {
data.isToBeMailed = Boolean(data.isToBeMailed);
};
const updateConfigLang = async lang => {
try {
await vnFormRef.value.submit();
userStore.updateUserLang(lang);
} catch (error) {
console.error(error);
}
};
onMounted(() => fetchLanguagesSql());
</script>
@ -113,9 +122,7 @@ onMounted(() => fetchLanguagesSql());
option-label="name"
option-value="code"
:options="langOptions"
@update:model-value="
userStore.updateUserLang(data.lang)
"
@update:model-value="updateConfigLang(data.lang)"
/>
</template>
<template #extraForm>

14
src/pages/Login/LoginView.vue
View File

@ -5,14 +5,18 @@ import { useI18n } from 'vue-i18n';
import { useUserStore } from 'stores/user';
import useNotify from 'src/composables/useNotify.js';
import { useRouter, useRoute } from 'vue-router';
import { storeToRefs } from 'pinia';
import { useAppStore } from 'src/stores/app';
const { notify } = useNotify();
const { t } = useI18n();
const { locale } = useI18n({ useScope: 'global' });
const userStore = useUserStore();
const appStore = useAppStore();
const route = useRoute();
const router = useRouter();
const { siteLang, localeOptions } = storeToRefs(appStore);
const email = ref(null);
const password = ref(null);
const remember = ref(false);
@ -20,12 +24,11 @@ const showPwd = ref(false);
const selectedLocaleValue = computed({
get() {
return userStore.localeOptions.find(
option => option.lang === locale.value
).value;
return siteLang.value;
},
set(value) {
locale.value = value;
appStore.updateSiteLocale(value);
}
});
@ -44,7 +47,6 @@ onMounted(() => {
const onLogin = async () => {
await userStore.fetchUser();
await userStore.updateUserLang(selectedLocaleValue.value);
await router.push('/');
};
@ -90,7 +92,7 @@ const loginAsGuest = async () => {
/>
<QSelect
v-model="selectedLocaleValue"
:options="userStore.localeOptions"
:options="localeOptions"
:label="t('language')"
option-value="lang"
dense

6
src/router/index.js
View File

@ -7,7 +7,6 @@ import {
createWebHashHistory
} from 'vue-router';
import routes from './routes';
import { i18n } from 'src/boot/i18n';
/*
* If not building with SSR mode, you can
@ -40,10 +39,9 @@ export default route(function (/* { store, ssrContext } */) {
Router.afterEach((to, from) => {
if (from.name === to.name) return;
const app = useAppStore();
app.$patch({
title: i18n.global.t(
to.meta.title ? `titles.${to.meta.title}` : 'titles.Home'
),
title: to.meta.title || 'Home',
subtitle: null,
useRightDrawer: false,
rightDrawerOpen: true

22
src/stores/app.js
View File

@ -6,6 +6,7 @@ import { useQuasar } from 'quasar';
const { notify } = useNotify();
const storageOrderName = 'hederaBasket';
const { t } = i18n.global;
export const useAppStore = defineStore('hedera', {
state: () => ({
@ -23,7 +24,15 @@ export const useAppStore = defineStore('hedera', {
months: [],
daysShort: [],
monthsShort: []
}
},
siteLang: null,
localeOptions: [
{ label: t('langs.en'), lang: 'en-US', value: 'en' },
{ label: t('langs.es'), lang: 'es-ES', value: 'es' },
{ label: t('langs.ca'), lang: 'ca-ES', value: 'ca' },
{ label: t('langs.fr'), lang: 'fr-FR', value: 'fr' },
{ label: t('langs.pt'), lang: 'pt-PT', value: 'pt' }
]
}),
actions: {
async getMenuLinks() {
@ -67,6 +76,7 @@ export const useAppStore = defineStore('hedera', {
},
async init() {
this.updateSiteLocale(localStorage.getItem('siteLang') || 'es-ES');
this.getBasketOrderId();
this.getLocaleDates();
},
@ -143,6 +153,13 @@ export const useAppStore = defineStore('hedera', {
onLogout() {
this.unloadOrder();
this.menuEssentialLinks = [];
},
updateSiteLocale(locale = null) {
const _locale = locale || 'es-ES';
i18n.global.locale.value = _locale;
this.siteLang = _locale;
localStorage.setItem('siteLang', _locale);
}
},
getters: {
@ -151,6 +168,9 @@ export const useAppStore = defineStore('hedera', {
item => !state.hiddenMenuLinks.has(item.description)
);
},
siteLocaleOption: state =>
state.localeOptions.find(l => l.value === state.siteLang),
menuTitle: state => t(`titles.${state.title}`),
isMobile() {
const $q = useQuasar();
return $q?.screen?.width <= 768;

25
src/stores/user.js
View File

@ -1,11 +1,9 @@
import { defineStore } from 'pinia';
import { ref, computed, watch } from 'vue';
import { api, jApi } from 'boot/axios';
import { i18n } from 'src/boot/i18n';
import useNotify from 'src/composables/useNotify.js';
import { useAppStore } from 'src/stores/app.js';
const { t } = i18n.global;
const { notify } = useNotify();
const TOKEN_MULTIMEDIA = 'tokenMultimedia';
const TOKEN = 'token';
@ -17,13 +15,7 @@ export const useUserStore = defineStore('user', () => {
const user = ref(null); // Usuario en uso => supplantedUser || mainUser
const supplantedUser = ref(null); // Usuario suplantado
const mainUser = ref(null); // Usuario principal logueado
const localeOptions = ref([
{ label: t('langs.en'), lang: 'en-US', value: 'en' },
{ label: t('langs.es'), lang: 'es-ES', value: 'es' },
{ label: t('langs.ca'), lang: 'ca-ES', value: 'ca' },
{ label: t('langs.fr'), lang: 'fr-FR', value: 'fr' },
{ label: t('langs.pt'), lang: 'pt-PT', value: 'pt' }
]);
const keepLogin = ref(false);
const intervalId = ref(null);
const isCheckingToken = ref(false);
@ -31,9 +23,6 @@ export const useUserStore = defineStore('user', () => {
let router;
const loggedIn = computed(() => !!token.value);
const userLocaleOption = computed(() =>
localeOptions.value?.find(l => l.value === user.value?.lang)
);
const storage = computed(() =>
keepLogin.value ? localStorage : sessionStorage
);
@ -51,7 +40,6 @@ export const useUserStore = defineStore('user', () => {
await fetchTokenConfig();
await fetchUser();
await supplantInit();
updateSiteLocale();
startInterval();
};
@ -277,17 +265,9 @@ export const useUserStore = defineStore('user', () => {
await fetchUser();
};
const updateSiteLocale = (locale = null) => {
i18n.global.locale.value =
locale || userLocaleOption.value?.lang || 'en-US';
};
const updateUserLang = async lang => {
if (!user.value || user.value.lang === lang) return;
user.value.lang = lang;
updateSiteLocale();
notify(t('dataSaved'), 'positive');
};
const $reset = () => {
@ -316,13 +296,11 @@ export const useUserStore = defineStore('user', () => {
user,
supplantedUser,
mainUser,
localeOptions,
keepLogin,
intervalId,
isCheckingToken,
tokenConfig,
loggedIn,
userLocaleOption,
storage,
getToken,
getTokenMultimedia,
@ -342,7 +320,6 @@ export const useUserStore = defineStore('user', () => {
supplantUser,
supplantInit,
logoutSupplantedUser,
updateSiteLocale,
updateUserLang,
init,
$reset