Merge branch 'dev' of https://gitea.verdnatura.es/verdnatura/salix-front into 5990-reStyle_summary
This commit is contained in:
commit
396b6d0298
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "salix-front",
|
||||
"version": "0.0.1",
|
||||
"version": "23.32.01",
|
||||
"lockfileVersion": 3,
|
||||
"requires": true,
|
||||
"packages": {
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "salix-front",
|
||||
"version": "23.30.01",
|
||||
"version": "23.32.01",
|
||||
"description": "Salix frontend",
|
||||
"productName": "Salix",
|
||||
"author": "Verdnatura",
|
||||
|
|
|
|||
|
|
@ -64,7 +64,7 @@ const onResponseError = (error) => {
|
|||
const url = hash.slice(1);
|
||||
Router.push({ path: url });
|
||||
} else if (!session.isLoggedIn()) {
|
||||
message = 'login.loginError';
|
||||
return Promise.reject(error);
|
||||
}
|
||||
|
||||
Notify.create({
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<script setup>
|
||||
import axios from 'axios';
|
||||
import { onMounted, ref, computed } from 'vue';
|
||||
import { onMounted, ref } from 'vue';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { QSeparator, useQuasar } from 'quasar';
|
||||
import { useRoute } from 'vue-router';
|
||||
|
|
@ -113,7 +113,7 @@ async function togglePinned(item, event) {
|
|||
<template>
|
||||
<QList padding class="column-max-width">
|
||||
<template v-if="$props.source === 'main'">
|
||||
<template v-if="this.$route.matched[1].name === 'Dashboard'">
|
||||
<template v-if="this.$route?.matched[1]?.name === 'Dashboard'">
|
||||
<QItem class="header">
|
||||
<QItemSection avatar>
|
||||
<QIcon name="view_module" />
|
||||
|
|
@ -156,7 +156,7 @@ async function togglePinned(item, event) {
|
|||
</template>
|
||||
|
||||
<template v-for="item in items" :key="item.name">
|
||||
<template v-if="item.name === this.$route.matched[1].name">
|
||||
<template v-if="item.name === this.$route?.matched[1]?.name">
|
||||
<QItem class="header">
|
||||
<QItemSection avatar v-if="item.icon">
|
||||
<QIcon :name="item.icon" />
|
||||
|
|
@ -211,7 +211,7 @@ async function togglePinned(item, event) {
|
|||
</QList>
|
||||
</template>
|
||||
|
||||
<style>
|
||||
<style scoped>
|
||||
.pinned .q-btn {
|
||||
visibility: hidden;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,30 @@
|
|||
import { ref, computed } from 'vue';
|
||||
|
||||
const user = ref({});
|
||||
|
||||
export function useLogin() {
|
||||
function getUser() {
|
||||
const userData = user.value;
|
||||
user.value = {};
|
||||
return computed(() => {
|
||||
return {
|
||||
user: userData.user,
|
||||
password: userData.password,
|
||||
keepLogin: userData.keepLogin,
|
||||
};
|
||||
});
|
||||
}
|
||||
|
||||
function setUser(data) {
|
||||
user.value = {
|
||||
user: data.user,
|
||||
password: data.password,
|
||||
keepLogin: data.keepLogin,
|
||||
};
|
||||
}
|
||||
|
||||
return {
|
||||
getUser,
|
||||
setUser,
|
||||
};
|
||||
}
|
||||
|
|
@ -29,4 +29,10 @@ body.body--light {
|
|||
background-color: white;
|
||||
color: #555;
|
||||
}
|
||||
}
|
||||
|
||||
.summary {
|
||||
.header {
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -20,6 +20,7 @@ export default {
|
|||
save: 'Save',
|
||||
remove: 'Remove',
|
||||
reset: 'Reset',
|
||||
close: 'Close',
|
||||
cancel: 'Cancel',
|
||||
confirm: 'Confirm',
|
||||
back: 'Back',
|
||||
|
|
@ -48,6 +49,20 @@ export default {
|
|||
loginSuccess: 'You have successfully logged in',
|
||||
loginError: 'Invalid username or password',
|
||||
fieldRequired: 'This field is required',
|
||||
twoFactorRequired: 'Two-factor verification required',
|
||||
pageTitles: {
|
||||
logIn: 'Login',
|
||||
},
|
||||
},
|
||||
twoFactor: {
|
||||
code: 'Code',
|
||||
validate: 'Validate',
|
||||
insert: 'Enter the verification code',
|
||||
explanation:
|
||||
'Please, enter the verification code that we have sent to your email in the next 5 minutes',
|
||||
pageTitles: {
|
||||
twoFactor: 'Two-Factor',
|
||||
},
|
||||
},
|
||||
dashboard: {
|
||||
pageTitles: {
|
||||
|
|
@ -448,6 +463,25 @@ export default {
|
|||
uncompleteTrays: 'There are incomplete trays',
|
||||
},
|
||||
},
|
||||
route: {
|
||||
pageTitles: {
|
||||
routes: 'Routes',
|
||||
cmrsList: 'External CMRs list',
|
||||
},
|
||||
cmr: {
|
||||
list: {
|
||||
total: 'Total {0} records',
|
||||
cmrFk: 'Cmr id',
|
||||
hasCmrDms: `Attached in gestdoc`,
|
||||
true: 'Yes',
|
||||
false: 'No',
|
||||
ticketFk: 'Ticketd id',
|
||||
country: 'Country',
|
||||
clientFk: 'Client id',
|
||||
shipped: 'Preparation date',
|
||||
},
|
||||
},
|
||||
},
|
||||
components: {
|
||||
topbar: {},
|
||||
userPanel: {
|
||||
|
|
|
|||
|
|
@ -20,6 +20,7 @@ export default {
|
|||
save: 'Guardar',
|
||||
remove: 'Eliminar',
|
||||
reset: 'Restaurar',
|
||||
close: 'Cerrar',
|
||||
cancel: 'Cancelar',
|
||||
confirm: 'Confirmar',
|
||||
back: 'Volver',
|
||||
|
|
@ -48,6 +49,20 @@ export default {
|
|||
loginSuccess: 'Inicio de sesión correcto',
|
||||
loginError: 'Nombre de usuario o contraseña incorrectos',
|
||||
fieldRequired: 'Este campo es obligatorio',
|
||||
twoFactorRequired: 'Verificación de doble factor requerida',
|
||||
pageTitles: {
|
||||
logIn: 'Inicio de sesión',
|
||||
},
|
||||
},
|
||||
twoFactor: {
|
||||
code: 'Código',
|
||||
validate: 'Validar',
|
||||
insert: 'Introduce el código de verificación',
|
||||
explanation:
|
||||
'Por favor, introduce el código de verificación que te hemos enviado a tu email en los próximos 5 minutos',
|
||||
pageTitles: {
|
||||
twoFactor: 'Doble factor',
|
||||
},
|
||||
},
|
||||
dashboard: {
|
||||
pageTitles: {
|
||||
|
|
@ -448,6 +463,25 @@ export default {
|
|||
uncompleteTrays: 'Hay bandejas sin completar',
|
||||
},
|
||||
},
|
||||
route: {
|
||||
pageTitles: {
|
||||
routes: 'Rutas',
|
||||
cmrsList: 'Listado de CMRs externos',
|
||||
},
|
||||
cmr: {
|
||||
list: {
|
||||
total: 'Total {0} registros',
|
||||
cmrFk: 'Id cmr',
|
||||
hasCmrDms: 'Adjuntado en gestdoc',
|
||||
true: 'Sí',
|
||||
false: 'No',
|
||||
ticketFk: 'Id ticket',
|
||||
country: 'País',
|
||||
clientFk: 'Id cliente',
|
||||
shipped: 'Fecha preparación',
|
||||
},
|
||||
},
|
||||
},
|
||||
components: {
|
||||
topbar: {},
|
||||
userPanel: {
|
||||
|
|
|
|||
|
|
@ -0,0 +1,111 @@
|
|||
<script setup>
|
||||
import { Dark, Quasar } from 'quasar';
|
||||
import { computed } from 'vue';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
|
||||
const { t, locale } = useI18n();
|
||||
|
||||
const userLocale = computed({
|
||||
get() {
|
||||
return locale.value;
|
||||
},
|
||||
set(value) {
|
||||
locale.value = value;
|
||||
|
||||
if (value === 'en') value = 'en-GB';
|
||||
|
||||
// FIXME: Dynamic imports from absolute paths are not compatible with vite:
|
||||
// https://github.com/rollup/plugins/tree/master/packages/dynamic-import-vars#limitations
|
||||
try {
|
||||
const langList = import.meta.glob('../../node_modules/quasar/lang/*.mjs');
|
||||
langList[`../../node_modules/quasar/lang/${value}.mjs`]().then((lang) => {
|
||||
Quasar.lang.set(lang.default);
|
||||
});
|
||||
} catch (error) {
|
||||
//
|
||||
}
|
||||
},
|
||||
});
|
||||
const darkMode = computed({
|
||||
get() {
|
||||
return Dark.isActive;
|
||||
},
|
||||
set(value) {
|
||||
Dark.set(value);
|
||||
},
|
||||
});
|
||||
const langs = ['en', 'es'];
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<QLayout view="hHh LpR fFf">
|
||||
<QHeader reveal class="bg-dark">
|
||||
<QToolbar class="justify-end">
|
||||
<QBtn
|
||||
id="switchLanguage"
|
||||
:label="t('globals.language')"
|
||||
icon="translate"
|
||||
color="primary"
|
||||
size="sm"
|
||||
flat
|
||||
rounded
|
||||
>
|
||||
<QMenu auto-close>
|
||||
<QList dense v-for="lang in langs" :key="lang">
|
||||
<QItem
|
||||
@click="userLocale = lang"
|
||||
:active="userLocale == lang"
|
||||
v-ripple
|
||||
clickable
|
||||
>
|
||||
{{ t(`globals.lang.${lang}`) }}
|
||||
</QItem>
|
||||
</QList>
|
||||
</QMenu>
|
||||
</QBtn>
|
||||
<QList>
|
||||
<QItem>
|
||||
<QItemSection>
|
||||
<QToggle
|
||||
v-model="darkMode"
|
||||
checked-icon="dark_mode"
|
||||
unchecked-icon="light_mode"
|
||||
:label="t(`globals.darkMode`)"
|
||||
/>
|
||||
</QItemSection>
|
||||
</QItem>
|
||||
</QList>
|
||||
</QToolbar>
|
||||
</QHeader>
|
||||
<QPageContainer>
|
||||
<QPage>
|
||||
<div class="form">
|
||||
<QCard class="q-pa-lg formCard">
|
||||
<RouterView></RouterView>
|
||||
</QCard>
|
||||
</div>
|
||||
</QPage>
|
||||
</QPageContainer>
|
||||
</QLayout>
|
||||
</template>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.form {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
min-height: inherit;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.formCard {
|
||||
max-width: 350px;
|
||||
min-width: 300px;
|
||||
}
|
||||
|
||||
@media (max-width: $breakpoint-xs-max) {
|
||||
.formCard {
|
||||
min-width: 100%;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,58 +1,30 @@
|
|||
<script setup>
|
||||
import { ref, computed } from 'vue';
|
||||
import { Dark, Quasar, useQuasar } from 'quasar';
|
||||
import { ref } from 'vue';
|
||||
import { Notify, useQuasar } from 'quasar';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { useRouter } from 'vue-router';
|
||||
import axios from 'axios';
|
||||
|
||||
import { useSession } from 'src/composables/useSession';
|
||||
import { useLogin } from 'src/composables/useLogin';
|
||||
|
||||
const quasar = useQuasar();
|
||||
const session = useSession();
|
||||
const loginCache = useLogin();
|
||||
const router = useRouter();
|
||||
const { t, locale } = useI18n();
|
||||
|
||||
const userLocale = computed({
|
||||
get() {
|
||||
return locale.value;
|
||||
},
|
||||
set(value) {
|
||||
locale.value = value;
|
||||
|
||||
if (value === 'en') value = 'en-GB';
|
||||
|
||||
// FIXME: Dynamic imports from absolute paths are not compatible with vite:
|
||||
// https://github.com/rollup/plugins/tree/master/packages/dynamic-import-vars#limitations
|
||||
try {
|
||||
const langList = import.meta.glob('../../node_modules/quasar/lang/*.mjs');
|
||||
langList[`../../node_modules/quasar/lang/${value}.mjs`]().then((lang) => {
|
||||
Quasar.lang.set(lang.default);
|
||||
});
|
||||
} catch (error) {
|
||||
//
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
const darkMode = computed({
|
||||
get() {
|
||||
return Dark.isActive;
|
||||
},
|
||||
set(value) {
|
||||
Dark.set(value);
|
||||
},
|
||||
});
|
||||
const { t } = useI18n();
|
||||
|
||||
const username = ref('');
|
||||
const password = ref('');
|
||||
const keepLogin = ref(true);
|
||||
|
||||
async function onSubmit() {
|
||||
const params = {
|
||||
user: username.value,
|
||||
password: password.value,
|
||||
};
|
||||
try {
|
||||
const { data } = await axios.post('Accounts/login', {
|
||||
user: username.value,
|
||||
password: password.value,
|
||||
});
|
||||
const { data } = await axios.post('Accounts/login', params);
|
||||
|
||||
if (!data) return;
|
||||
|
||||
|
|
@ -69,122 +41,63 @@ async function onSubmit() {
|
|||
} else {
|
||||
router.push({ name: 'Dashboard' });
|
||||
}
|
||||
} catch (e) {
|
||||
//
|
||||
} catch (res) {
|
||||
if (res.response?.data?.error?.code === 'REQUIRES_2FA') {
|
||||
Notify.create({
|
||||
message: t('login.twoFactorRequired'),
|
||||
icon: 'phonelink_lock',
|
||||
type: 'warning',
|
||||
});
|
||||
params.keepLogin = keepLogin.value;
|
||||
loginCache.setUser(params);
|
||||
return router.push({
|
||||
name: 'TwoFactor',
|
||||
query: router.currentRoute.value?.query,
|
||||
});
|
||||
}
|
||||
Notify.create({
|
||||
message: t('login.loginError'),
|
||||
type: 'negative',
|
||||
});
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<QLayout>
|
||||
<QPageContainer>
|
||||
<QPage id="login">
|
||||
<QPageSticky position="top-right">
|
||||
<QToolbar>
|
||||
<QBtn
|
||||
id="switchLanguage"
|
||||
:label="t('globals.language')"
|
||||
icon="translate"
|
||||
color="primary"
|
||||
size="sm"
|
||||
flat
|
||||
rounded
|
||||
>
|
||||
<QMenu auto-close>
|
||||
<QList dense>
|
||||
<QItem
|
||||
@click="userLocale = 'en'"
|
||||
:active="userLocale == 'en'"
|
||||
v-ripple
|
||||
clickable
|
||||
>
|
||||
{{ t('globals.lang.en') }}
|
||||
</QItem>
|
||||
<QItem
|
||||
@click="userLocale = 'es'"
|
||||
:active="userLocale == 'es'"
|
||||
v-ripple
|
||||
clickable
|
||||
>
|
||||
{{ t('globals.lang.es') }}
|
||||
</QItem>
|
||||
</QList>
|
||||
</QMenu>
|
||||
</QBtn>
|
||||
<QList>
|
||||
<QItem>
|
||||
<QItemSection>
|
||||
<QItemLabel caption>
|
||||
{{ t(`globals.darkMode`) }}
|
||||
</QItemLabel>
|
||||
</QItemSection>
|
||||
<QItemSection side>
|
||||
<QToggle
|
||||
v-model="darkMode"
|
||||
checked-icon="dark_mode"
|
||||
unchecked-icon="light_mode"
|
||||
/>
|
||||
</QItemSection>
|
||||
</QItem>
|
||||
</QList>
|
||||
</QToolbar>
|
||||
</QPageSticky>
|
||||
<div class="login-form q-pa-xl">
|
||||
<QImg
|
||||
src="~/assets/logo.svg"
|
||||
alt="Logo"
|
||||
fit="contain"
|
||||
:ratio="16 / 9"
|
||||
class="q-mb-md"
|
||||
/>
|
||||
<QForm @submit="onSubmit" class="q-gutter-md">
|
||||
<QInput
|
||||
v-model="username"
|
||||
:label="t('login.username')"
|
||||
lazy-rules
|
||||
:rules="[
|
||||
(val) =>
|
||||
(val && val.length > 0) || t('login.fieldRequired'),
|
||||
]"
|
||||
/>
|
||||
<QInput
|
||||
type="password"
|
||||
v-model="password"
|
||||
:label="t('login.password')"
|
||||
lazy-rules
|
||||
:rules="[
|
||||
(val) =>
|
||||
(val && val.length > 0) || t('login.fieldRequired'),
|
||||
]"
|
||||
/>
|
||||
<QToggle v-model="keepLogin" :label="t('login.keepLogin')" />
|
||||
<QImg
|
||||
src="~/assets/logo.svg"
|
||||
alt="Logo"
|
||||
fit="contain"
|
||||
:ratio="16 / 9"
|
||||
class="q-mb-md"
|
||||
/>
|
||||
<QForm @submit="onSubmit" class="q-gutter-md q-pa-lg">
|
||||
<QInput
|
||||
v-model="username"
|
||||
:label="t('login.username')"
|
||||
lazy-rules
|
||||
:rules="[(val) => (val && val.length > 0) || t('login.fieldRequired')]"
|
||||
/>
|
||||
<QInput
|
||||
type="password"
|
||||
v-model="password"
|
||||
:label="t('login.password')"
|
||||
lazy-rules
|
||||
:rules="[(val) => (val && val.length > 0) || t('login.fieldRequired')]"
|
||||
/>
|
||||
<QToggle v-model="keepLogin" :label="t('login.keepLogin')" />
|
||||
|
||||
<div>
|
||||
<QBtn
|
||||
:label="t('login.submit')"
|
||||
type="submit"
|
||||
color="primary"
|
||||
class="full-width"
|
||||
rounded
|
||||
unelevated
|
||||
/>
|
||||
</div>
|
||||
</QForm>
|
||||
</div>
|
||||
</QPage>
|
||||
</QPageContainer>
|
||||
</QLayout>
|
||||
<div>
|
||||
<QBtn
|
||||
:label="t('login.submit')"
|
||||
type="submit"
|
||||
color="primary"
|
||||
class="full-width"
|
||||
rounded
|
||||
unelevated
|
||||
/>
|
||||
</div>
|
||||
</QForm>
|
||||
</template>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
#login {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
min-height: inherit;
|
||||
}
|
||||
|
||||
.login-form {
|
||||
width: 400px;
|
||||
}
|
||||
</style>
|
||||
<style lang="scss" scoped></style>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,80 @@
|
|||
<script setup>
|
||||
import { ref } from 'vue';
|
||||
import { useQuasar } from 'quasar';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { useRouter } from 'vue-router';
|
||||
import axios from 'axios';
|
||||
|
||||
import { useSession } from 'src/composables/useSession';
|
||||
import { useLogin } from 'src/composables/useLogin';
|
||||
|
||||
const quasar = useQuasar();
|
||||
const session = useSession();
|
||||
const router = useRouter();
|
||||
const loginCache = useLogin();
|
||||
const { t } = useI18n();
|
||||
|
||||
const code = ref('');
|
||||
const params = loginCache.getUser().value;
|
||||
if (!params.user) {
|
||||
router.push({ name: 'Login' });
|
||||
}
|
||||
|
||||
async function onSubmit() {
|
||||
try {
|
||||
params.code = code.value;
|
||||
const { data } = await axios.post('VnUsers/validate-auth', params);
|
||||
|
||||
if (!data) return;
|
||||
|
||||
await session.login(data.token, params.keepLogin);
|
||||
quasar.notify({
|
||||
message: t('login.loginSuccess'),
|
||||
type: 'positive',
|
||||
});
|
||||
|
||||
const currentRoute = router.currentRoute.value;
|
||||
if (currentRoute.query && currentRoute.query.redirect) {
|
||||
router.push(currentRoute.query.redirect);
|
||||
} else {
|
||||
router.push({ name: 'Dashboard' });
|
||||
}
|
||||
} catch (e) {
|
||||
quasar.notify({
|
||||
message: e.response?.data?.error.message,
|
||||
type: 'negative',
|
||||
});
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<template>
|
||||
<QForm @submit="onSubmit" class="q-gutter-md q-pa-lg">
|
||||
<div class="column items-center">
|
||||
<QIcon name="phonelink_lock" size="xl" color="primary" />
|
||||
<h5 class="text-center q-my-md">{{ t('twoFactor.insert') }}</h5>
|
||||
</div>
|
||||
<QInput
|
||||
v-model="code"
|
||||
:hint="t('twoFactor.explanation')"
|
||||
mask="# # # # # #"
|
||||
fill-mask
|
||||
unmasked-value
|
||||
autofocus
|
||||
>
|
||||
<template #prepend>
|
||||
<QIcon name="lock" />
|
||||
</template>
|
||||
</QInput>
|
||||
<div class="q-mt-xl">
|
||||
<QBtn
|
||||
:label="t('twoFactor.validate')"
|
||||
type="submit"
|
||||
color="primary"
|
||||
class="full-width q-mt-md"
|
||||
rounded
|
||||
unelevated
|
||||
/>
|
||||
</div>
|
||||
</QForm>
|
||||
</template>
|
||||
<style lang="scss" scoped></style>
|
||||
|
|
@ -0,0 +1,141 @@
|
|||
<script setup>
|
||||
import { ref } from 'vue';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import FetchData from 'components/FetchData.vue';
|
||||
import VnFilterPanel from 'src/components/ui/VnFilterPanel.vue';
|
||||
|
||||
const { t } = useI18n();
|
||||
const props = defineProps({
|
||||
dataKey: {
|
||||
type: String,
|
||||
required: true,
|
||||
},
|
||||
});
|
||||
|
||||
const countries = ref();
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<FetchData url="Countries" @on-fetch="(data) => (countries = data)" auto-load />
|
||||
<VnFilterPanel :data-key="props.dataKey" :search-button="true">
|
||||
<template #tags="{ tag, formatFn }">
|
||||
<div class="q-gutter-x-xs">
|
||||
<strong>{{ t(`params.${tag.label}`) }}: </strong>
|
||||
<span>{{ formatFn(tag.value) }}</span>
|
||||
</div>
|
||||
</template>
|
||||
<template #body="{ params }">
|
||||
<QList dense>
|
||||
<QItem>
|
||||
<QItemSection>
|
||||
<QInput :label="t('route.cmr.list.cmrFk')" v-model="params.cmrFk" lazy-rules>
|
||||
<template #prepend>
|
||||
<QIcon name="article" size="sm"></QIcon>
|
||||
</template>
|
||||
</QInput>
|
||||
</QItemSection>
|
||||
</QItem>
|
||||
<QItem>
|
||||
<QItemSection>
|
||||
<QCheckbox
|
||||
:label="t('route.cmr.list.hasCmrDms')"
|
||||
v-model="params.hasCmrDms"
|
||||
lazy-rules
|
||||
/>
|
||||
</QItemSection>
|
||||
</QItem>
|
||||
<QItem>
|
||||
<QItemSection>
|
||||
<QInput :label="t('route.cmr.list.ticketFk')" v-model="params.ticketFk" lazy-rules>
|
||||
<template #prepend>
|
||||
<QIcon name="vn:ticket" size="sm"></QIcon>
|
||||
</template>
|
||||
</QInput>
|
||||
</QItemSection>
|
||||
</QItem>
|
||||
<QItem>
|
||||
<QItemSection>
|
||||
<QInput :label="t('route.cmr.list.clientFk')" v-model="params.clientFk" lazy-rules>
|
||||
<template #prepend>
|
||||
<QIcon name="vn:client" size="sm"></QIcon>
|
||||
</template>
|
||||
</QInput>
|
||||
</QItemSection>
|
||||
</QItem>
|
||||
<QItem>
|
||||
<QItemSection v-if="!countries">
|
||||
<QSkeleton type="QInput" class="full-width" />
|
||||
</QItemSection>
|
||||
<QItemSection v-if="countries">
|
||||
<QSelect
|
||||
:label="t('route.cmr.list.country')"
|
||||
v-model="params.country"
|
||||
:options="countries"
|
||||
option-value="country"
|
||||
option-label="country"
|
||||
transition-show="jump-down"
|
||||
transition-hide="jump-up"
|
||||
emit-value
|
||||
map-options
|
||||
>
|
||||
<template #prepend>
|
||||
<QIcon name="flag" size="sm"></QIcon>
|
||||
</template>
|
||||
</QSelect>
|
||||
</QItemSection>
|
||||
</QItem>
|
||||
<QItem>
|
||||
<QItemSection>
|
||||
<QInput
|
||||
:label="t('route.cmr.list.shipped')"
|
||||
v-model="params.shipped"
|
||||
mask="date"
|
||||
>
|
||||
<template #append>
|
||||
<QIcon name="event" class="cursor-pointer">
|
||||
<QPopupProxy
|
||||
cover
|
||||
transition-show="rotate"
|
||||
transition-hide="rotate"
|
||||
>
|
||||
<QDate v-model="params.shipped" minimal>
|
||||
<div class="row items-center justify-end q-gutter-sm">
|
||||
<QBtn
|
||||
:label="t('globals.close')"
|
||||
color="primary"
|
||||
flat
|
||||
@click="save"
|
||||
v-close-popup
|
||||
/>
|
||||
</div>
|
||||
</QDate>
|
||||
</QPopupProxy>
|
||||
</QIcon>
|
||||
</template>
|
||||
</QInput>
|
||||
</QItemSection>
|
||||
</QItem>
|
||||
</QList>
|
||||
</template>
|
||||
</VnFilterPanel>
|
||||
</template>
|
||||
|
||||
<i18n>
|
||||
en:
|
||||
params:
|
||||
cmrFk: Cmr id,
|
||||
hasCmrDms: Attached in gestdoc,
|
||||
ticketFk: Ticketd id,
|
||||
country: Country,
|
||||
clientFk: Client id,
|
||||
shipped: Preparation date,
|
||||
|
||||
es:
|
||||
params:
|
||||
cmrFk: Id cmr,
|
||||
hasCmrDms: Adjuntado en gestdoc,
|
||||
ticketFk: Id ticket,
|
||||
country: País,
|
||||
clientFk: Id cliente,
|
||||
shipped: Fecha preparación,
|
||||
</i18n>
|
||||
|
|
@ -0,0 +1,130 @@
|
|||
<script setup>
|
||||
import { computed } from 'vue';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { useStateStore } from 'stores/useStateStore';
|
||||
import VnPaginate from 'components/ui/VnPaginate.vue';
|
||||
import { useSession } from 'src/composables/useSession';
|
||||
import { toDate } from 'filters/index';
|
||||
import CmrFilter from './CmrFilter.vue';
|
||||
|
||||
const stateStore = useStateStore();
|
||||
const { t } = useI18n();
|
||||
const session = useSession();
|
||||
const token = session.getToken();
|
||||
|
||||
const columns = computed(() => [
|
||||
{
|
||||
name: 'cmrFk',
|
||||
label: t('route.cmr.list.cmrFk'),
|
||||
field: (row) => row.cmrFk,
|
||||
sortable: true,
|
||||
},
|
||||
{
|
||||
name: 'hasCmrDms',
|
||||
label: t('route.cmr.list.hasCmrDms'),
|
||||
field: (row) => row.hasCmrDms,
|
||||
align: 'center',
|
||||
sortable: true,
|
||||
headerStyle: 'padding-left: 35px',
|
||||
},
|
||||
{
|
||||
name: 'ticketFk',
|
||||
label: t('route.cmr.list.ticketFk'),
|
||||
field: (row) => row.ticketFk,
|
||||
sortable: true,
|
||||
},
|
||||
{
|
||||
name: 'clientFk',
|
||||
label: t('route.cmr.list.clientFk'),
|
||||
field: (row) => row.clientFk,
|
||||
sortable: true,
|
||||
},
|
||||
{
|
||||
name: 'country',
|
||||
label: t('route.cmr.list.country'),
|
||||
field: (row) => row.country,
|
||||
align: 'left',
|
||||
sortable: true,
|
||||
},
|
||||
{
|
||||
name: 'shipped',
|
||||
label: t('route.cmr.list.shipped'),
|
||||
field: (row) => toDate(row.shipped),
|
||||
align: 'center',
|
||||
sortable: true,
|
||||
headerStyle: 'padding-left: 33px',
|
||||
},
|
||||
]);
|
||||
function getProjectUrl() {
|
||||
return ((new URL(window.location)).origin);
|
||||
};
|
||||
</script>
|
||||
<template>
|
||||
<div class="column items-center">
|
||||
<div class="list">
|
||||
<VnPaginate
|
||||
data-key="CmrList"
|
||||
:url="`Routes/getExternalCmrs`"
|
||||
order="cmrFk DESC"
|
||||
limit="null"
|
||||
auto-load
|
||||
>
|
||||
<template #body="{ rows }">
|
||||
<QTable
|
||||
:columns="columns"
|
||||
:rows="rows"
|
||||
:dense="$q.screen.lt.md"
|
||||
:pagination="{ rowsPerPage: null }"
|
||||
hide-pagination
|
||||
:grid="$q.screen.lt.md"
|
||||
auto-load
|
||||
>
|
||||
<template #top>
|
||||
{{ t('route.cmr.list.total', [rows.length]) }}
|
||||
</template>
|
||||
<template #body-cell-cmrFk="{ value }">
|
||||
<QTd align="right" class="text-primary">
|
||||
<a :href="`${getProjectUrl()}/api/Routes/${value}/cmr?access_token=${token}`" target="_blank">
|
||||
<span class="text-primary">{{ value }}</span>
|
||||
</a>
|
||||
</QTd>
|
||||
</template>
|
||||
<template #body-cell-hasCmrDms="{ value }">
|
||||
<QTd align="center">
|
||||
<QBadge
|
||||
:id="(value) ? 'true' : 'false'"
|
||||
:label="(value)
|
||||
? t('route.cmr.list.true')
|
||||
: t('route.cmr.list.false')"
|
||||
/>
|
||||
</QTd>
|
||||
</template>
|
||||
</QTable>
|
||||
</template>
|
||||
</VnPaginate>
|
||||
</div>
|
||||
<QDrawer v-model="stateStore.rightDrawer" side="right" :width="256" show-if-above>
|
||||
<QScrollArea class="fit text-grey-8">
|
||||
<CmrFilter data-key="CmrList" />
|
||||
</QScrollArea>
|
||||
</QDrawer>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.list {
|
||||
padding-top: 15px;
|
||||
padding-bottom: 15px;
|
||||
max-width: 900px;
|
||||
width: 100%;
|
||||
}
|
||||
.grid-style-transition {
|
||||
transition: transform 0.28s, background-color 0.28s;
|
||||
}
|
||||
#true {
|
||||
background-color: $positive;
|
||||
}
|
||||
#false {
|
||||
background-color: $negative;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,17 @@
|
|||
<script setup>
|
||||
import { useStateStore } from 'stores/useStateStore';
|
||||
import LeftMenu from 'src/components/LeftMenu.vue';
|
||||
|
||||
const stateStore = useStateStore();
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<QDrawer v-model="stateStore.leftDrawer" show-if-above :width="256">
|
||||
<QScrollArea class="fit text-grey-8">
|
||||
<LeftMenu />
|
||||
</QScrollArea>
|
||||
</QDrawer>
|
||||
<QPageContainer>
|
||||
<RouterView></RouterView>
|
||||
</QPageContainer>
|
||||
</template>
|
||||
|
|
@ -45,8 +45,8 @@ export { Router };
|
|||
export default route(function (/* { store, ssrContext } */) {
|
||||
Router.beforeEach(async (to, from, next) => {
|
||||
const { isLoggedIn } = session;
|
||||
|
||||
if (!isLoggedIn() && to.name !== 'Login') {
|
||||
const outLayout = ['Login', 'TwoFactor'];
|
||||
if (!isLoggedIn() && !outLayout.includes(to.name)) {
|
||||
return next({ name: 'Login', query: { redirect: to.fullPath } });
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -4,6 +4,7 @@ import Claim from './claim';
|
|||
import InvoiceOut from './invoiceOut';
|
||||
import Worker from './worker';
|
||||
import Wagon from './wagon';
|
||||
import Route from './route';
|
||||
|
||||
export default [
|
||||
Customer,
|
||||
|
|
@ -11,5 +12,6 @@ export default [
|
|||
Claim,
|
||||
InvoiceOut,
|
||||
Worker,
|
||||
Wagon
|
||||
Wagon,
|
||||
Route
|
||||
]
|
||||
|
|
|
|||
|
|
@ -0,0 +1,35 @@
|
|||
import { RouterView } from 'vue-router';
|
||||
|
||||
export default {
|
||||
path: '/route',
|
||||
name: 'Route',
|
||||
meta: {
|
||||
title: 'routes',
|
||||
icon: 'vn:delivery',
|
||||
},
|
||||
component: RouterView,
|
||||
redirect: { name: 'RouteMain' },
|
||||
menus: {
|
||||
main: ['CmrList'],
|
||||
card: [],
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: '/route',
|
||||
name: 'RouteMain',
|
||||
component: () => import('src/pages/Route/RouteMain.vue'),
|
||||
redirect: { name: 'CmrList' },
|
||||
children: [
|
||||
{
|
||||
path: 'cmr/list',
|
||||
name: 'CmrList',
|
||||
meta: {
|
||||
title: 'cmrsList',
|
||||
icon: 'fact_check',
|
||||
},
|
||||
component: () => import('src/pages/Route/Cmr/CmrList.vue')
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
};
|
||||
|
|
@ -4,13 +4,26 @@ import claim from './modules/claim';
|
|||
import worker from './modules/worker';
|
||||
import invoiceOut from './modules/invoiceOut';
|
||||
import wagon from './modules/wagon';
|
||||
import route from './modules/route';
|
||||
|
||||
const routes = [
|
||||
{
|
||||
path: '/login',
|
||||
name: 'Login',
|
||||
meta: { title: 'logIn' },
|
||||
component: () => import('../pages/Login/LoginMain.vue'),
|
||||
component: () => import('../layouts/OutLayout.vue'),
|
||||
children: [
|
||||
{
|
||||
path: '',
|
||||
name: 'Login',
|
||||
meta: { title: 'logIn' },
|
||||
component: () => import('../pages/Login/LoginMain.vue'),
|
||||
},
|
||||
{
|
||||
path: '/twoFactor',
|
||||
name: 'TwoFactor',
|
||||
meta: { title: 'twoFactor' },
|
||||
component: () => import('../pages/Login/TwoFactor.vue'),
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
path: '/',
|
||||
|
|
@ -35,7 +48,8 @@ const routes = [
|
|||
name: 'NotFound',
|
||||
component: () => import('../pages/NotFound.vue'),
|
||||
},
|
||||
wagon
|
||||
wagon,
|
||||
route,
|
||||
],
|
||||
},
|
||||
];
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@ import { useRole } from 'src/composables/useRole';
|
|||
import routes from 'src/router/modules';
|
||||
|
||||
export const useNavigationStore = defineStore('navigationStore', () => {
|
||||
const modules = ['customer', 'claim', 'ticket', 'invoiceOut', 'worker', 'wagon'];
|
||||
const modules = ['customer', 'claim', 'ticket', 'invoiceOut', 'worker', 'wagon', 'route'];
|
||||
const pinnedModules = ref([]);
|
||||
const role = useRole();
|
||||
|
||||
|
|
|
|||
|
|
@ -3,28 +3,37 @@ describe('Login', () => {
|
|||
beforeEach(() => {
|
||||
cy.visit('/#/login');
|
||||
cy.get('#switchLanguage').click();
|
||||
cy.get('div.q-menu div.q-item:nth-child(1)').click();
|
||||
cy.get('.q-menu > :nth-child(1) > .q-item').click();
|
||||
});
|
||||
|
||||
it('should fail to log in using wrong user', () => {
|
||||
cy.get('input[aria-label="Username"]').type('incorrectUser');
|
||||
cy.get('input[aria-label="Password"]').type('nightmare');
|
||||
cy.get('button[type="submit"]').click();
|
||||
cy.get('.q-notification__message').should('have.text', 'Invalid username or password');
|
||||
cy.get('.q-notification__message').should(
|
||||
'have.text',
|
||||
'Invalid username or password'
|
||||
);
|
||||
});
|
||||
|
||||
it('should fail to log in using wrong password', () => {
|
||||
cy.get('input[aria-label="Username"]').type('employee');
|
||||
cy.get('input[aria-label="Password"]').type('wrongPassword');
|
||||
cy.get('button[type="submit"]').click();
|
||||
cy.get('.q-notification__message').should('have.text', 'Invalid username or password');
|
||||
cy.get('.q-notification__message').should(
|
||||
'have.text',
|
||||
'Invalid username or password'
|
||||
);
|
||||
});
|
||||
|
||||
it('should log in', () => {
|
||||
cy.get('input[aria-label="Username"]').type('employee');
|
||||
cy.get('input[aria-label="Password"]').type('nightmare');
|
||||
cy.get('button[type="submit"]').click();
|
||||
cy.get('.q-notification__message').should('have.text', 'You have successfully logged in');
|
||||
cy.get('.q-notification__message').should(
|
||||
'have.text',
|
||||
'You have successfully logged in'
|
||||
);
|
||||
cy.url().should('contain', '/dashboard');
|
||||
});
|
||||
|
||||
|
|
@ -32,7 +41,10 @@ describe('Login', () => {
|
|||
cy.get('input[aria-label="Username"]').type('employee');
|
||||
cy.get('input[aria-label="Password"]').type('nightmare');
|
||||
cy.get('button[type="submit"]').click();
|
||||
cy.get('.q-notification__message').should('have.text', 'You have successfully logged in');
|
||||
cy.get('.q-notification__message').should(
|
||||
'have.text',
|
||||
'You have successfully logged in'
|
||||
);
|
||||
cy.url().should('contain', '/dashboard');
|
||||
cy.get('#user').click();
|
||||
cy.get('#logout').click();
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
describe('WorkerNotificationsManager', () => {
|
||||
xdescribe('WorkerNotificationsManager', () => {
|
||||
beforeEach(() => {
|
||||
const workerId = 1110;
|
||||
cy.viewport(1280, 720);
|
||||
|
|
@ -9,16 +9,25 @@ describe('WorkerNotificationsManager', () => {
|
|||
it('should unsubscribe 2 notifications, check the unsubscription has been saved, subscribe to other one and should check the data has been saved', () => {
|
||||
cy.get('.q-chip').should('have.length', 3);
|
||||
cy.get('.q-toggle__thumb').eq(0).click();
|
||||
cy.get('.q-notification__message').should('have.text', 'Unsubscribed from the notification');
|
||||
cy.get('.q-notification__message').should(
|
||||
'have.text',
|
||||
'Unsubscribed from the notification'
|
||||
);
|
||||
cy.get('.q-chip > .q-icon').eq(0).click();
|
||||
|
||||
cy.reload();
|
||||
|
||||
cy.get('.q-chip').should('have.length', 1);
|
||||
cy.get('.q-toggle__thumb').should('have.length', 3).eq(0).click();
|
||||
cy.get('.q-notification__message').should('have.text', 'Subscribed to the notification');
|
||||
cy.get('.q-notification__message').should(
|
||||
'have.text',
|
||||
'Subscribed to the notification'
|
||||
);
|
||||
cy.get('.q-toggle__thumb').should('have.length', 3).eq(1).click();
|
||||
cy.get('.q-notification__message').should('have.text', 'Subscribed to the notification');
|
||||
cy.get('.q-notification__message').should(
|
||||
'have.text',
|
||||
'Subscribed to the notification'
|
||||
);
|
||||
|
||||
cy.reload();
|
||||
|
||||
|
|
|
|||
|
|
@ -45,7 +45,7 @@ vi.mock('src/router/modules', () => ({
|
|||
],
|
||||
}));
|
||||
|
||||
describe.skip('Leftmenu', () => {
|
||||
describe('Leftmenu', () => {
|
||||
let vm;
|
||||
let navigation;
|
||||
beforeAll(() => {
|
||||
|
|
|
|||
Loading…
Reference in New Issue