fixes #5056 Nuevo sistema de sacado de pedidos: Gestión de vagones #43
|
@ -29,7 +29,7 @@ module.exports = configure(function (/* ctx */) {
|
|||
// app boot file (/src/boot)
|
||||
// --> boot files are part of "main.js"
|
||||
// https://v2.quasar.dev/quasar-cli/boot-files
|
||||
boot: ['i18n', 'axios'],
|
||||
boot: ['i18n', 'axios', 'vnDate'],
|
||||
|
||||
// https://v2.quasar.dev/quasar-cli-vite/quasar-config-js#css
|
||||
css: ['app.scss'],
|
||||
|
|
65
src/App.vue
65
src/App.vue
|
@ -1,16 +1,10 @@
|
|||
<script setup>
|
||||
import { onMounted } from 'vue';
|
||||
import axios from 'axios';
|
||||
import { useQuasar } from 'quasar';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { useRouter } from 'vue-router';
|
||||
import { useSession } from 'src/composables/useSession';
|
||||
|
||||
const quasar = useQuasar();
|
||||
const router = useRouter();
|
||||
const session = useSession();
|
||||
const { t, availableLocales, locale, fallbackLocale } = useI18n();
|
||||
const { isLoggedIn } = session;
|
||||
const { availableLocales, locale, fallbackLocale } = useI18n();
|
||||
|
||||
onMounted(() => {
|
||||
let userLang = window.navigator.language;
|
||||
|
@ -39,63 +33,6 @@ quasar.iconMapFn = (iconName) => {
|
|||
content: iconName,
|
||||
};
|
||||
};
|
||||
|
||||
function responseError(error) {
|
||||
let message = error.message;
|
||||
let logOut = false;
|
||||
|
||||
switch (error.response?.status) {
|
||||
case 401:
|
||||
message = 'login.loginError';
|
||||
|
||||
if (isLoggedIn()) {
|
||||
message = 'errors.statusUnauthorized';
|
||||
logOut = true;
|
||||
}
|
||||
break;
|
||||
case 403:
|
||||
message = 'errors.statusUnauthorized';
|
||||
break;
|
||||
case 500:
|
||||
message = 'errors.statusInternalServerError';
|
||||
break;
|
||||
case 502:
|
||||
message = 'errors.statusBadGateway';
|
||||
break;
|
||||
case 504:
|
||||
message = 'errors.statusGatewayTimeout';
|
||||
break;
|
||||
}
|
||||
|
||||
let translatedMessage = t(message);
|
||||
if (!translatedMessage) translatedMessage = message;
|
||||
|
||||
quasar.notify({
|
||||
message: translatedMessage,
|
||||
type: 'negative',
|
||||
});
|
||||
|
||||
if (logOut) {
|
||||
session.destroy();
|
||||
router.push({ path: '/login' });
|
||||
}
|
||||
|
||||
return Promise.reject(error);
|
||||
}
|
||||
|
||||
axios.interceptors.response.use((response) => {
|
||||
const { method } = response.config;
|
||||
|
||||
const isSaveRequest = method === 'patch';
|
||||
if (isSaveRequest) {
|
||||
quasar.notify({
|
||||
message: t('globals.dataSaved'),
|
||||
type: 'positive',
|
||||
icon: 'check',
|
||||
});
|
||||
}
|
||||
return response;
|
||||
}, responseError);
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
|
|
@ -1,24 +1,80 @@
|
|||
import { boot } from 'quasar/wrappers';
|
||||
import axios from 'axios';
|
||||
import { Notify } from 'quasar';
|
||||
import { useSession } from 'src/composables/useSession';
|
||||
import { Router } from 'src/router';
|
||||
import { i18n } from './i18n';
|
||||
|
||||
export default boot(() => {
|
||||
const { getToken } = useSession();
|
||||
const session = useSession();
|
||||
const { t } = i18n.global;
|
||||
|
||||
axios.defaults.baseURL = '/api/';
|
||||
|
||||
axios.interceptors.request.use(
|
||||
function (context) {
|
||||
const token = getToken();
|
||||
|
||||
if (token.length && context.headers) {
|
||||
context.headers.Authorization = token;
|
||||
const onRequest = (config) => {
|
||||
const token = session.getToken();
|
||||
if (token.length && config.headers) {
|
||||
config.headers.Authorization = token;
|
||||
}
|
||||
|
||||
return context;
|
||||
},
|
||||
function (error) {
|
||||
return config;
|
||||
};
|
||||
|
||||
const onRequestError = (error) => {
|
||||
return Promise.reject(error);
|
||||
}
|
||||
);
|
||||
};
|
||||
|
||||
const onResponse = (response) => {
|
||||
const { method } = response.config;
|
||||
|
||||
const isSaveRequest = method === 'patch';
|
||||
if (isSaveRequest) {
|
||||
Notify.create({
|
||||
message: t('globals.dataSaved'),
|
||||
type: 'positive',
|
||||
});
|
||||
}
|
||||
|
||||
return response;
|
||||
};
|
||||
|
||||
const onResponseError = (error) => {
|
||||
let message = '';
|
||||
|
||||
const response = error.response;
|
||||
const responseData = response && response.data;
|
||||
const responseError = responseData && response.data.error;
|
||||
if (responseError) {
|
||||
message = responseError.message;
|
||||
}
|
||||
|
||||
switch (response.status) {
|
||||
case 500:
|
||||
message = 'errors.statusInternalServerError';
|
||||
break;
|
||||
case 502:
|
||||
message = 'errors.statusBadGateway';
|
||||
break;
|
||||
case 504:
|
||||
message = 'errors.statusGatewayTimeout';
|
||||
break;
|
||||
}
|
||||
|
||||
if (session.isLoggedIn && response.status === 401) {
|
||||
session.destroy();
|
||||
Router.push({ path: '/login' });
|
||||
}
|
||||
|
||||
Notify.create({
|
||||
message: t(message),
|
||||
type: 'negative',
|
||||
});
|
||||
|
||||
return Promise.reject(error);
|
||||
};
|
||||
|
||||
axios.interceptors.request.use(onRequest, onRequestError);
|
||||
axios.interceptors.response.use(onResponse, onResponseError);
|
||||
|
||||
export {
|
||||
onRequest,
|
||||
onResponseError
|
||||
}
|
||||
|
|
|
@ -0,0 +1,18 @@
|
|||
import { boot } from 'quasar/wrappers';
|
||||
|
||||
export default boot(() => {
|
||||
Date.vnUTC = () => {
|
||||
const env = process.env.NODE_ENV;
|
||||
if (!env || env === 'development') return new Date(Date.UTC(2001, 0, 1, 11));
|
||||
|
||||
return new Date();
|
||||
};
|
||||
|
||||
Date.vnNew = () => {
|
||||
return new Date(Date.vnUTC());
|
||||
};
|
||||
|
||||
Date.vnNow = () => {
|
||||
return new Date(Date.vnUTC()).getTime();
|
||||
};
|
||||
});
|
|
@ -14,14 +14,14 @@ const props = defineProps({
|
|||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
url: {
|
||||
type: String,
|
||||
default: '',
|
||||
},
|
||||
data: {
|
||||
type: Array,
|
||||
default: null,
|
||||
},
|
||||
url: {
|
||||
type: String,
|
||||
default: '',
|
||||
},
|
||||
filter: {
|
||||
type: Object,
|
||||
default: null,
|
||||
|
@ -38,6 +38,10 @@ const props = defineProps({
|
|||
type: Number,
|
||||
default: 10,
|
||||
},
|
||||
userParams: {
|
||||
type: Object,
|
||||
default: null,
|
||||
},
|
||||
offset: {
|
||||
type: Number,
|
||||
default: 500,
|
||||
|
@ -58,6 +62,7 @@ const arrayData = useArrayData(props.dataKey, {
|
|||
where: props.where,
|
||||
limit: props.limit,
|
||||
order: props.order,
|
||||
userParams: props.userParams,
|
||||
});
|
||||
const store = arrayData.store;
|
||||
|
||||
|
@ -123,12 +128,20 @@ async function onLoad(...params) {
|
|||
|
||||
<template>
|
||||
<div>
|
||||
<div
|
||||
v-if="!props.autoLoad && !store.data && !isLoading"
|
||||
class="info-row q-pa-md text-center"
|
||||
>
|
||||
<h5>
|
||||
{{ t('No data to display') }}
|
||||
</h5>
|
||||
</div>
|
||||
<div
|
||||
v-if="store.data && store.data.length === 0 && !isLoading"
|
||||
class="info-row q-pa-md text-center"
|
||||
>
|
||||
<h5>
|
||||
{{ t('components.smartCard.noData') }}
|
||||
{{ t('No results found') }}
|
||||
</h5>
|
||||
</div>
|
||||
<div v-if="props.autoLoad && !store.data" class="card-list q-gutter-y-md">
|
||||
|
@ -160,9 +173,6 @@ async function onLoad(...params) {
|
|||
</template>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
// .q-infinite-scroll {
|
||||
// width: 100%;
|
||||
// }
|
||||
.info-row {
|
||||
width: 100%;
|
||||
|
||||
|
@ -171,3 +181,9 @@ async function onLoad(...params) {
|
|||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
<i18n>
|
||||
es:
|
||||
No data to display: Sin datos que mostrar
|
||||
No results found: No se han encontrado resultados
|
||||
</i18n>
|
||||
|
|
|
@ -3,12 +3,13 @@ import { ref } from 'vue';
|
|||
import { useDialogPluginComponent } from 'quasar';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
|
||||
const $props = defineProps({
|
||||
address: {
|
||||
type: String,
|
||||
default: '',
|
||||
const props = defineProps({
|
||||
data: {
|
||||
type: Object,
|
||||
requied: true,
|
||||
default: null,
|
||||
},
|
||||
send: {
|
||||
promise: {
|
||||
type: Function,
|
||||
required: true,
|
||||
},
|
||||
|
@ -19,24 +20,30 @@ defineEmits(['confirm', ...useDialogPluginComponent.emits]);
|
|||
const { dialogRef, onDialogOK } = useDialogPluginComponent();
|
||||
const { t } = useI18n();
|
||||
|
||||
const address = ref($props.address);
|
||||
const address = ref(props.data.address);
|
||||
const isLoading = ref(false);
|
||||
|
||||
async function confirm() {
|
||||
isLoading.value = true;
|
||||
await $props.send(address.value);
|
||||
isLoading.value = false;
|
||||
const response = { address };
|
||||
|
||||
onDialogOK();
|
||||
if (props.promise) {
|
||||
isLoading.value = true;
|
||||
try {
|
||||
Object.assign(response, props.data);
|
||||
await props.promise(response);
|
||||
} finally {
|
||||
isLoading.value = false;
|
||||
}
|
||||
}
|
||||
|
||||
onDialogOK(response);
|
||||
}
|
||||
</script>
|
||||
<template>
|
||||
<q-dialog ref="dialogRef" persistent>
|
||||
<q-card class="q-pa-sm">
|
||||
<q-card-section class="row items-center q-pb-none">
|
||||
<span class="text-h6 text-grey">{{
|
||||
t('Send email notification: Send email notification')
|
||||
}}</span>
|
||||
<span class="text-h6 text-grey">{{ t('Send email notification') }}</span>
|
||||
<q-space />
|
||||
<q-btn icon="close" flat round dense v-close-popup />
|
||||
</q-card-section>
|
||||
|
@ -53,6 +60,7 @@ async function confirm() {
|
|||
color="primary"
|
||||
:loading="isLoading"
|
||||
@click="confirm"
|
||||
unelevated
|
||||
/>
|
||||
</q-card-actions>
|
||||
</q-card>
|
||||
|
@ -67,6 +75,6 @@ async function confirm() {
|
|||
|
||||
<i18n>
|
||||
es:
|
||||
Send email notification: Enviar notificación por correo,
|
||||
Send email notification: Enviar notificación por correo
|
||||
The notification will be sent to the following address: La notificación se enviará a la siguiente dirección
|
||||
</i18n>
|
||||
|
|
|
@ -0,0 +1,261 @@
|
|||
<script setup>
|
||||
import { ref, computed } from 'vue';
|
||||
import { useDialogPluginComponent } from 'quasar';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
|
||||
const { dialogRef, onDialogOK } = useDialogPluginComponent();
|
||||
const { t, availableLocales } = useI18n();
|
||||
|
||||
defineEmits(['confirm', ...useDialogPluginComponent.emits]);
|
||||
const props = defineProps({
|
||||
subject: {
|
||||
type: String,
|
||||
required: false,
|
||||
default: 'Verdnatura',
|
||||
},
|
||||
phone: {
|
||||
type: String,
|
||||
required: true,
|
||||
},
|
||||
template: {
|
||||
type: String,
|
||||
required: true,
|
||||
},
|
||||
locale: {
|
||||
type: String,
|
||||
required: false,
|
||||
default: 'es',
|
||||
},
|
||||
data: {
|
||||
type: Object,
|
||||
required: false,
|
||||
default: null,
|
||||
},
|
||||
promise: {
|
||||
type: Function,
|
||||
required: true,
|
||||
},
|
||||
});
|
||||
|
||||
const maxLength = 160;
|
||||
const locale = ref(props.locale);
|
||||
const subject = ref(props.subject);
|
||||
const phone = ref(props.phone);
|
||||
const message = ref('');
|
||||
|
||||
updateMessage();
|
||||
|
||||
function updateMessage() {
|
||||
const params = props.data;
|
||||
const key = `templates['${props.template}']`;
|
||||
|
||||
message.value = t(key, params, { locale: locale.value });
|
||||
}
|
||||
|
||||
const totalLength = computed(() => message.value.length);
|
||||
const color = computed(() => {
|
||||
if (totalLength.value == maxLength) return 'negative';
|
||||
if ((totalLength.value / maxLength) * 100 > 90) return 'warning';
|
||||
return 'positive';
|
||||
});
|
||||
|
||||
const languages = availableLocales.map((locale) => ({ label: t(locale), value: locale }));
|
||||
|
||||
const isLoading = ref(false);
|
||||
async function send() {
|
||||
const response = {
|
||||
destination: phone.value,
|
||||
message: message.value,
|
||||
};
|
||||
if (props.promise) {
|
||||
isLoading.value = true;
|
||||
|
||||
try {
|
||||
Object.assign(response, props.data);
|
||||
await props.promise(response);
|
||||
} finally {
|
||||
isLoading.value = false;
|
||||
}
|
||||
}
|
||||
|
||||
onDialogOK(response);
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<q-dialog ref="dialogRef" persistent>
|
||||
<q-card class="q-pa-sm">
|
||||
<q-card-section class="row items-center q-pb-none">
|
||||
<span class="text-h6 text-grey">
|
||||
{{ t('Send SMS') }}
|
||||
</span>
|
||||
<q-space />
|
||||
<q-btn icon="close" :disable="isLoading" flat round dense v-close-popup />
|
||||
</q-card-section>
|
||||
<q-card-section v-if="props.locale">
|
||||
<q-banner class="bg-amber text-white" rounded dense>
|
||||
<template #avatar>
|
||||
<q-icon name="warning" />
|
||||
</template>
|
||||
<span
|
||||
v-html="t('CustomerDefaultLanguage', { locale: t(props.locale) })"
|
||||
></span>
|
||||
</q-banner>
|
||||
</q-card-section>
|
||||
<q-card-section class="q-pb-xs">
|
||||
<q-select
|
||||
:label="t('Language')"
|
||||
:options="languages"
|
||||
v-model="locale"
|
||||
@update:model-value="updateMessage()"
|
||||
emit-value
|
||||
map-options
|
||||
:input-debounce="0"
|
||||
rounded
|
||||
outlined
|
||||
dense
|
||||
/>
|
||||
</q-card-section>
|
||||
<q-card-section class="q-pb-xs">
|
||||
<q-input
|
||||
:label="t('Phone')"
|
||||
v-model="phone"
|
||||
rounded
|
||||
outlined
|
||||
autofocus
|
||||
dense
|
||||
/>
|
||||
</q-card-section>
|
||||
<q-card-section class="q-pb-xs">
|
||||
<q-input
|
||||
:label="t('Subject')"
|
||||
v-model="subject"
|
||||
rounded
|
||||
outlined
|
||||
autofocus
|
||||
dense
|
||||
/>
|
||||
</q-card-section>
|
||||
<q-card-section class="q-mb-md" q-input>
|
||||
<q-input
|
||||
:label="t('Message')"
|
||||
v-model="message"
|
||||
type="textarea"
|
||||
:maxlength="maxLength"
|
||||
:counter="true"
|
||||
:autogrow="true"
|
||||
:bottom-slots="true"
|
||||
:rules="[(value) => value.length < maxLength || 'Error!']"
|
||||
stack-label
|
||||
outlined
|
||||
autofocus
|
||||
>
|
||||
<template #append>
|
||||
<q-icon
|
||||
v-if="message !== ''"
|
||||
name="close"
|
||||
@click="message = ''"
|
||||
class="cursor-pointer"
|
||||
/>
|
||||
</template>
|
||||
<template #counter>
|
||||
<q-chip :color="color" dense>
|
||||
{{ totalLength }}/{{ maxLength }}
|
||||
</q-chip>
|
||||
</template>
|
||||
</q-input>
|
||||
</q-card-section>
|
||||
<q-card-actions align="right">
|
||||
<q-btn
|
||||
:label="t('globals.cancel')"
|
||||
color="primary"
|
||||
:disable="isLoading"
|
||||
flat
|
||||
v-close-popup
|
||||
/>
|
||||
<q-btn
|
||||
:label="t('globals.confirm')"
|
||||
@click="send()"
|
||||
:loading="isLoading"
|
||||
color="primary"
|
||||
unelevated
|
||||
/>
|
||||
</q-card-actions>
|
||||
</q-card>
|
||||
</q-dialog>
|
||||
</template>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.q-chip {
|
||||
transition: background 0.36s;
|
||||
}
|
||||
.q-card {
|
||||
width: 500px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<i18n>
|
||||
en:
|
||||
CustomerDefaultLanguage: This customer uses <strong>{locale}</strong> as their default language
|
||||
templates:
|
||||
pendingPayment: 'Your order is pending of payment.
|
||||
Please, enter the website and make the payment with a credit card. Thank you.'
|
||||
minAmount: 'A minimum amount of 50€ (VAT excluded) is required for your order
|
||||
{ orderId } of { shipped } to receive it without additional shipping costs.'
|
||||
orderChanges: 'Order {orderId} of { shipped }: { changes }'
|
||||
en: English
|
||||
es: Spanish
|
||||
fr: French
|
||||
pt: Portuguese
|
||||
es:
|
||||
Send SMS: Enviar SMS
|
||||
CustomerDefaultLanguage: Este cliente utiliza <strong>{locale}</strong> como idioma por defecto
|
||||
Language: Idioma
|
||||
Phone: Móvil
|
||||
Subject: Asunto
|
||||
Message: Mensaje
|
||||
templates:
|
||||
pendingPayment: 'Su pedido está pendiente de pago.
|
||||
Por favor, entre en la página web y efectue el pago con tarjeta. Muchas gracias.'
|
||||
minAmount: 'Es necesario un importe mínimo de 50€ (Sin IVA) en su pedido
|
||||
{ orderId } del día { shipped } para recibirlo sin portes adicionales.'
|
||||
orderChanges: 'Pedido {orderId} día { shipped }: { changes }'
|
||||
en: Inglés
|
||||
es: Español
|
||||
fr: Francés
|
||||
pt: Portugués
|
||||
fr:
|
||||
Send SMS: Envoyer SMS
|
||||
CustomerDefaultLanguage: Ce client utilise l'{locale} comme langue par défaut
|
||||
Language: Langage
|
||||
Phone: Mobile
|
||||
Subject: Affaire
|
||||
Message: Message
|
||||
templates:
|
||||
pendingPayment: 'Votre commande est en attente de paiement.
|
||||
Veuillez vous connecter sur le site web et effectuer le paiement par carte. Merci beaucoup.'
|
||||
minAmount: 'Un montant minimum de 50€ (TVA non incluse) est requis pour votre commande
|
||||
{ orderId } du { shipped } afin de la recevoir sans frais de port supplémentaires.'
|
||||
orderChanges: 'Commande { orderId } du { shipped }: { changes }'
|
||||
en: Anglais
|
||||
es: Espagnol
|
||||
fr: Français
|
||||
pt: Portugais
|
||||
pt:
|
||||
Send SMS: Enviar SMS
|
||||
CustomerDefaultLanguage: Este cliente utiliza o <strong>{locale}</strong> como seu idioma padrão
|
||||
Language: Linguagem
|
||||
Phone: Móvel
|
||||
Subject: Assunto
|
||||
Message: Mensagem
|
||||
templates:
|
||||
pendingPayment: 'Seu pedido está pendente de pagamento.
|
||||
Por favor, acesse o site e faça o pagamento com cartão. Muito obrigado.'
|
||||
minAmount: 'É necessário um valor mínimo de 50€ (sem IVA) em seu pedido
|
||||
{ orderId } do dia { shipped } para recebê-lo sem custos de envio adicionais.'
|
||||
orderChanges: 'Pedido { orderId } dia { shipped }: { changes }'
|
||||
en: Inglês
|
||||
es: Espanhol
|
||||
fr: Francês
|
||||
pt: Português
|
||||
</i18n>
|
|
@ -59,9 +59,9 @@ watch(props, async () => {
|
|||
:to="{ name: `${module}Summary`, params: { id: entity.id } }"
|
||||
>
|
||||
<q-btn round flat dense size="md" icon="launch" color="white">
|
||||
<q-tooltip>{{
|
||||
t('components.cardDescriptor.summary')
|
||||
}}</q-tooltip>
|
||||
<q-tooltip>
|
||||
{{ t('components.cardDescriptor.summary') }}
|
||||
</q-tooltip>
|
||||
</q-btn>
|
||||
</router-link>
|
||||
|
||||
|
|
|
@ -10,7 +10,7 @@ const props = defineProps({
|
|||
type: String,
|
||||
default: null,
|
||||
},
|
||||
question: {
|
||||
title: {
|
||||
type: String,
|
||||
default: null,
|
||||
},
|
||||
|
@ -18,15 +18,37 @@ const props = defineProps({
|
|||
type: String,
|
||||
default: null,
|
||||
},
|
||||
data: {
|
||||
type: Object,
|
||||
required: false,
|
||||
default: null,
|
||||
},
|
||||
promise: {
|
||||
type: Function,
|
||||
required: false,
|
||||
default: null,
|
||||
},
|
||||
});
|
||||
|
||||
defineEmits(['confirm', ...useDialogPluginComponent.emits]);
|
||||
|
||||
const { dialogRef, onDialogOK } = useDialogPluginComponent();
|
||||
|
||||
const question = props.question || t('question');
|
||||
const message = props.message || t('message');
|
||||
const title = props.title || t('Confirm');
|
||||
const message = props.message || t('Are you sure you want to continue?');
|
||||
const isLoading = ref(false);
|
||||
|
||||
async function confirm() {
|
||||
isLoading.value = true;
|
||||
if (props.promise) {
|
||||
try {
|
||||
await props.promise(props.data);
|
||||
} finally {
|
||||
isLoading.value = false;
|
||||
}
|
||||
}
|
||||
onDialogOK(props.data);
|
||||
}
|
||||
</script>
|
||||
<template>
|
||||
<q-dialog ref="dialogRef" persistent>
|
||||
|
@ -39,20 +61,28 @@ const isLoading = ref(false);
|
|||
size="xl"
|
||||
v-if="icon"
|
||||
/>
|
||||
<span class="text-h6 text-grey">{{ message }}</span>
|
||||
<span class="text-h6 text-grey">{{ title }}</span>
|
||||
<q-space />
|
||||
<q-btn icon="close" flat round dense v-close-popup />
|
||||
<q-btn icon="close" :disable="isLoading" flat round dense v-close-popup />
|
||||
</q-card-section>
|
||||
<q-card-section class="row items-center">
|
||||
{{ question }}
|
||||
{{ message }}
|
||||
</q-card-section>
|
||||
<q-card-actions align="right">
|
||||
<q-btn :label="t('globals.cancel')" color="primary" flat v-close-popup />
|
||||
<q-btn
|
||||
:label="t('globals.cancel')"
|
||||
color="primary"
|
||||
:disable="isLoading"
|
||||
flat
|
||||
v-close-popup
|
||||
/>
|
||||
<q-btn
|
||||
:label="t('globals.confirm')"
|
||||
color="primary"
|
||||
:loading="isLoading"
|
||||
@click="onDialogOK()"
|
||||
@click="confirm()"
|
||||
unelevated
|
||||
autofocus
|
||||
/>
|
||||
</q-card-actions>
|
||||
</q-card>
|
||||
|
@ -66,13 +96,7 @@ const isLoading = ref(false);
|
|||
</style>
|
||||
|
||||
<i18n>
|
||||
"en": {
|
||||
"question": "Are you sure you want to continue?",
|
||||
"message": "Confirm"
|
||||
}
|
||||
|
||||
"es": {
|
||||
"question": "¿Seguro que quieres continuar?",
|
||||
"message": "Confirmar"
|
||||
}
|
||||
es:
|
||||
Confirm: Confirmar
|
||||
Are you sure you want to continue?: ¿Seguro que quieres continuar?
|
||||
</i18n>
|
||||
|
|
|
@ -15,6 +15,11 @@ const props = defineProps({
|
|||
required: false,
|
||||
default: false,
|
||||
},
|
||||
params: {
|
||||
type: Object,
|
||||
required: false,
|
||||
default: null,
|
||||
},
|
||||
});
|
||||
|
||||
const emit = defineEmits(['refresh', 'clear']);
|
||||
|
@ -24,8 +29,9 @@ const store = arrayData.store;
|
|||
const userParams = ref({});
|
||||
|
||||
onMounted(() => {
|
||||
if (props.params) userParams.value = props.params;
|
||||
const params = store.userParams;
|
||||
if (params) {
|
||||
if (Object.keys(params).length > 0) {
|
||||
userParams.value = Object.assign({}, params);
|
||||
}
|
||||
});
|
||||
|
|
|
@ -23,11 +23,42 @@ const props = defineProps({
|
|||
required: false,
|
||||
default: true,
|
||||
},
|
||||
url: {
|
||||
type: String,
|
||||
default: '',
|
||||
},
|
||||
filter: {
|
||||
type: Object,
|
||||
default: null,
|
||||
},
|
||||
where: {
|
||||
type: Object,
|
||||
default: null,
|
||||
},
|
||||
order: {
|
||||
type: String,
|
||||
default: '',
|
||||
},
|
||||
limit: {
|
||||
type: Number,
|
||||
default: 10,
|
||||
},
|
||||
userParams: {
|
||||
type: Object,
|
||||
default: null,
|
||||
},
|
||||
});
|
||||
|
||||
const router = useRouter();
|
||||
const route = useRoute();
|
||||
const arrayData = useArrayData(props.dataKey);
|
||||
const arrayData = useArrayData(props.dataKey, {
|
||||
url: props.url,
|
||||
filter: props.filter,
|
||||
where: props.where,
|
||||
limit: props.limit,
|
||||
order: props.order,
|
||||
userParams: props.userParams,
|
||||
});
|
||||
const store = arrayData.store;
|
||||
const searchText = ref('');
|
||||
|
||||
|
|
|
@ -20,20 +20,27 @@ export function useArrayData(key, userOptions) {
|
|||
|
||||
const page = ref(1);
|
||||
|
||||
if (typeof userOptions === 'object') {
|
||||
if (userOptions.filter) store.filter = userOptions.filter;
|
||||
if (userOptions.url) store.url = userOptions.url;
|
||||
if (userOptions.limit) store.limit = userOptions.limit;
|
||||
if (userOptions.order) store.order = userOptions.order;
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
setOptions();
|
||||
|
||||
const query = route.query;
|
||||
if (query.params) {
|
||||
store.userParams = JSON.parse(query.params);
|
||||
}
|
||||
});
|
||||
|
||||
function setOptions() {
|
||||
if (typeof userOptions === 'object') {
|
||||
for (const option in userOptions) {
|
||||
if (userOptions[option] == null) continue;
|
||||
|
||||
if (Object.prototype.hasOwnProperty.call(store, option)) {
|
||||
store[option] = userOptions[option];
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
async function fetch({ append = false }) {
|
||||
if (!store.url) return;
|
||||
|
||||
|
|
|
@ -1,5 +1,6 @@
|
|||
import toLowerCase from './toLowerCase';
|
||||
import toDate from './toDate';
|
||||
import toDateString from './toDateString';
|
||||
import toCurrency from './toCurrency';
|
||||
import toPercentage from './toPercentage';
|
||||
import toLowerCamel from './toLowerCamel';
|
||||
|
@ -9,6 +10,7 @@ export {
|
|||
toLowerCase,
|
||||
toLowerCamel,
|
||||
toDate,
|
||||
toDateString,
|
||||
toCurrency,
|
||||
toPercentage,
|
||||
dashIfEmpty,
|
||||
|
|
|
@ -0,0 +1,10 @@
|
|||
export default function toDateString(date) {
|
||||
let day = date.getDate();
|
||||
let month = date.getMonth() + 1;
|
||||
let year = date.getFullYear();
|
||||
|
||||
if (day < 10) day = `0${day}`;
|
||||
if (month < 10) month = `0${month}`;
|
||||
|
||||
return `${year}-${month}-${day}`
|
||||
}
|
|
@ -434,7 +434,6 @@ export default {
|
|||
logOut: 'Log Out',
|
||||
},
|
||||
smartCard: {
|
||||
noData: 'No data to display',
|
||||
openCard: 'View card',
|
||||
openSummary: 'Open summary',
|
||||
viewDescription: 'View description',
|
||||
|
|
|
@ -433,7 +433,6 @@ export default {
|
|||
logOut: 'Cerrar sesión',
|
||||
},
|
||||
smartCard: {
|
||||
noData: 'Sin datos que mostrar',
|
||||
openCard: 'Ver ficha',
|
||||
openSummary: 'Abrir detalles',
|
||||
viewDescription: 'Ver descripción',
|
||||
|
|
|
@ -12,6 +12,7 @@ const { t } = useI18n();
|
|||
<Teleport to="#searchbar" v-if="stateStore.isHeaderMounted()">
|
||||
<VnSearchbar
|
||||
data-key="ClaimList"
|
||||
url="Claims/filter"
|
||||
:label="t('Search claim')"
|
||||
:info="t('You can search by claim id or customer name')"
|
||||
/>
|
||||
|
|
|
@ -4,7 +4,7 @@ import { useRoute } from 'vue-router';
|
|||
import { useI18n } from 'vue-i18n';
|
||||
import { toDate } from 'src/filters';
|
||||
|
||||
import TicketDescriptorPopover from 'pages/Ticket/Card/TicketDescriptorPopover.vue';
|
||||
import TicketDescriptorProxy from 'pages/Ticket/Card/TicketDescriptorProxy.vue';
|
||||
import ClaimDescriptorMenu from 'pages/Claim/Card/ClaimDescriptorMenu.vue';
|
||||
import CardDescriptor from 'components/ui/CardDescriptor.vue';
|
||||
|
||||
|
@ -86,9 +86,8 @@ function stateColor(code) {
|
|||
<q-item-label>
|
||||
<span class="link">
|
||||
{{ entity.ticketFk }}
|
||||
<q-popup-proxy>
|
||||
<ticket-descriptor-popover :id="entity.ticketFk" />
|
||||
</q-popup-proxy>
|
||||
|
||||
<TicketDescriptorProxy :id="entity.ticketFk" />
|
||||
</span>
|
||||
</q-item-label>
|
||||
</q-item-section>
|
||||
|
|
|
@ -6,6 +6,7 @@ import { useI18n } from 'vue-i18n';
|
|||
import { useRouter } from 'vue-router';
|
||||
import { usePrintService } from 'composables/usePrintService';
|
||||
import SendEmailDialog from 'components/common/SendEmailDialog.vue';
|
||||
import VnConfirm from 'components/ui/VnConfirm.vue';
|
||||
|
||||
const $props = defineProps({
|
||||
claim: {
|
||||
|
@ -33,13 +34,15 @@ function confirmPickupOrder() {
|
|||
quasar.dialog({
|
||||
component: SendEmailDialog,
|
||||
componentProps: {
|
||||
data: {
|
||||
address: customer.email,
|
||||
},
|
||||
send: sendPickupOrder,
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
function sendPickupOrder(address) {
|
||||
function sendPickupOrder({ address }) {
|
||||
const id = claim.value.id;
|
||||
const customer = claim.value.client;
|
||||
return sendEmail(`Claims/${id}/claim-pickup-email`, {
|
||||
|
@ -48,16 +51,26 @@ function sendPickupOrder(address) {
|
|||
});
|
||||
}
|
||||
|
||||
const showConfirmDialog = ref(false);
|
||||
async function deleteClaim() {
|
||||
function confirmRemove() {
|
||||
quasar
|
||||
.dialog({
|
||||
component: VnConfirm,
|
||||
componentProps: {
|
||||
title: t('confirmDeletion'),
|
||||
message: t('confirmDeletionMessage'),
|
||||
promise: remove,
|
||||
},
|
||||
})
|
||||
.onOk(async () => await router.push({ name: 'ClaimList' }));
|
||||
}
|
||||
|
||||
async function remove() {
|
||||
const id = claim.value.id;
|
||||
await axios.delete(`Claims/${id}`);
|
||||
quasar.notify({
|
||||
message: t('globals.dataDeleted'),
|
||||
type: 'positive',
|
||||
icon: 'check',
|
||||
type: 'positive'
|
||||
});
|
||||
await router.push({ name: 'ClaimList' });
|
||||
}
|
||||
</script>
|
||||
<template>
|
||||
|
@ -87,27 +100,12 @@ async function deleteClaim() {
|
|||
</q-menu>
|
||||
</q-item>
|
||||
<q-separator />
|
||||
<q-item @click="showConfirmDialog = true" v-ripple clickable>
|
||||
<q-item @click="confirmRemove()" v-ripple clickable>
|
||||
<q-item-section avatar>
|
||||
<q-icon name="delete" />
|
||||
</q-item-section>
|
||||
<q-item-section>{{ t('deleteClaim') }}</q-item-section>
|
||||
</q-item>
|
||||
|
||||
<q-dialog v-model="showConfirmDialog">
|
||||
<q-card class="q-pa-sm">
|
||||
<q-card-section class="row items-center q-pb-none">
|
||||
<span class="text-h6 text-grey">{{ t('confirmDeletion') }}</span>
|
||||
<q-space />
|
||||
<q-btn icon="close" flat round dense v-close-popup />
|
||||
</q-card-section>
|
||||
<q-card-section class="row items-center">{{ t('confirmDeletionMessage') }}</q-card-section>
|
||||
<q-card-actions align="right">
|
||||
<q-btn :label="t('globals.cancel')" color="primary" flat v-close-popup />
|
||||
<q-btn :label="t('globals.confirm')" color="primary" @click="deleteClaim" />
|
||||
</q-card-actions>
|
||||
</q-card>
|
||||
</q-dialog>
|
||||
</template>
|
||||
|
||||
<i18n>
|
||||
|
|
|
@ -158,6 +158,12 @@ en:
|
|||
hasToPickUp: Has to pick Up
|
||||
dmsFk: Document ID
|
||||
text: Description
|
||||
claimStateFk: Claim State
|
||||
workerFk: Worker
|
||||
clientFk: Customer
|
||||
rma: RMA
|
||||
responsibility: Responsibility
|
||||
packages: Packages
|
||||
es:
|
||||
Audit logs: Registros de auditoría
|
||||
Property: Propiedad
|
||||
|
@ -186,4 +192,10 @@ es:
|
|||
hasToPickUp: Se debe recoger
|
||||
dmsFk: ID documento
|
||||
text: Descripción
|
||||
claimStateFk: Estado de la reclamación
|
||||
workerFk: Trabajador
|
||||
clientFk: Cliente
|
||||
rma: RMA
|
||||
responsibility: Responsabilidad
|
||||
packages: Bultos
|
||||
</i18n>
|
||||
|
|
|
@ -64,23 +64,23 @@ function openDialog(dmsId) {
|
|||
multimediaDialog.value = true;
|
||||
}
|
||||
|
||||
function viewDeleteDms(dmsId) {
|
||||
function viewDeleteDms(index) {
|
||||
quasar
|
||||
.dialog({
|
||||
component: VnConfirm,
|
||||
componentProps: {
|
||||
message: t('This file will be deleted'),
|
||||
title: t('This file will be deleted'),
|
||||
icon: 'delete',
|
||||
data: { index },
|
||||
promise: deleteDms,
|
||||
},
|
||||
})
|
||||
.onOk(() => deleteDms(dmsId));
|
||||
.onOk(() => claimDms.value.splice(index, 1));
|
||||
}
|
||||
|
||||
async function deleteDms(index) {
|
||||
async function deleteDms({ index }) {
|
||||
const dmsId = claimDms.value[index].dmsFk;
|
||||
await axios.post(`ClaimDms/${dmsId}/removeFile`);
|
||||
|
||||
claimDms.value.splice(index, 1);
|
||||
quasar.notify({
|
||||
message: t('globals.dataDeleted'),
|
||||
type: 'positive',
|
||||
|
|
|
@ -69,18 +69,19 @@ function confirmRemove(id) {
|
|||
quasar
|
||||
.dialog({
|
||||
component: VnConfirm,
|
||||
componentProps: {
|
||||
data: { id },
|
||||
promise: remove,
|
||||
},
|
||||
})
|
||||
.onOk(() => remove(id));
|
||||
.onOk(async () => await arrayData.refresh());
|
||||
}
|
||||
|
||||
async function remove(id) {
|
||||
async function remove({ id }) {
|
||||
await axios.delete(`ClaimRmas/${id}`);
|
||||
await arrayData.refresh();
|
||||
|
||||
quasar.notify({
|
||||
type: 'positive',
|
||||
message: t('globals.rowRemoved'),
|
||||
icon: 'check',
|
||||
});
|
||||
}
|
||||
</script>
|
||||
|
|
|
@ -4,6 +4,7 @@ import { useRoute } from 'vue-router';
|
|||
import { useI18n } from 'vue-i18n';
|
||||
import { toDate, toCurrency } from 'src/filters';
|
||||
import CardSummary from 'components/ui/CardSummary.vue';
|
||||
import WorkerDescriptorProxy from 'pages/Worker/Card/WorkerDescriptorProxy.vue';
|
||||
|
||||
const route = useRoute();
|
||||
const { t } = useI18n();
|
||||
|
@ -109,22 +110,30 @@ function stateColor(code) {
|
|||
</q-item>
|
||||
<q-item>
|
||||
<q-item-section v-if="claim.worker && claim.worker.user">
|
||||
<q-item-label caption>{{
|
||||
t('claim.summary.assignedTo')
|
||||
}}</q-item-label>
|
||||
<q-item-label>{{
|
||||
claim.worker.user.nickname
|
||||
}}</q-item-label>
|
||||
<q-item-label caption>
|
||||
{{ t('claim.summary.assignedTo') }}
|
||||
</q-item-label>
|
||||
<q-item-label>
|
||||
<span class="link">
|
||||
{{ claim.worker.user.nickname }}
|
||||
<WorkerDescriptorProxy :id="claim.workerFk" />
|
||||
</span>
|
||||
</q-item-label>
|
||||
</q-item-section>
|
||||
<q-item-section
|
||||
v-if="claim.client && claim.client.salesPersonUser"
|
||||
>
|
||||
<q-item-label caption>{{
|
||||
t('claim.summary.attendedBy')
|
||||
}}</q-item-label>
|
||||
<q-item-label>{{
|
||||
claim.client.salesPersonUser.name
|
||||
}}</q-item-label>
|
||||
<q-item-label caption>
|
||||
{{ t('claim.summary.attendedBy') }}
|
||||
</q-item-label>
|
||||
<q-item-label>
|
||||
<span class="link">
|
||||
{{ claim.client.salesPersonUser.name }}
|
||||
<WorkerDescriptorProxy
|
||||
:id="claim.client.salesPersonFk"
|
||||
/>
|
||||
</span>
|
||||
</q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
|
|
|
@ -6,7 +6,7 @@ import { useStateStore } from 'stores/useStateStore';
|
|||
import { toDate } from 'filters/index';
|
||||
import Paginate from 'components/PaginateData.vue';
|
||||
import ClaimSummaryDialog from './Card/ClaimSummaryDialog.vue';
|
||||
import CustomerDescriptorPopover from 'pages/Customer/Card/CustomerDescriptorPopover.vue';
|
||||
import CustomerDescriptorProxy from 'pages/Customer/Card/CustomerDescriptorProxy.vue';
|
||||
import VnSearchbar from 'components/ui/VnSearchbar.vue';
|
||||
import ClaimFilter from './ClaimFilter.vue';
|
||||
|
||||
|
@ -173,9 +173,8 @@ function viewSummary(id) {
|
|||
<q-tooltip>
|
||||
{{ t('components.smartCard.viewDescription') }}
|
||||
</q-tooltip>
|
||||
<q-popup-proxy>
|
||||
<CustomerDescriptorPopover :id="row.clientFk" />
|
||||
</q-popup-proxy>
|
||||
|
||||
<CustomerDescriptorProxy :id="row.clientFk" />
|
||||
</q-btn>
|
||||
</q-card-actions>
|
||||
</q-item>
|
||||
|
|
|
@ -16,7 +16,7 @@ const input = ref();
|
|||
|
||||
const newRma = ref({
|
||||
code: '',
|
||||
crated: new Date(),
|
||||
crated: Date.vnNew(),
|
||||
});
|
||||
|
||||
function onInputUpdate(value) {
|
||||
|
@ -35,7 +35,7 @@ async function submit() {
|
|||
|
||||
newRma.value = {
|
||||
code: '',
|
||||
created: new Date(),
|
||||
created: Date.vnNew(),
|
||||
};
|
||||
}
|
||||
|
||||
|
@ -43,23 +43,25 @@ function confirm(id) {
|
|||
quasar
|
||||
.dialog({
|
||||
component: VnConfirm,
|
||||
componentProps: {
|
||||
data: { id },
|
||||
promise: remove,
|
||||
},
|
||||
})
|
||||
.onOk(() => remove(id));
|
||||
.onOk(async () => await arrayData.refresh());
|
||||
}
|
||||
|
||||
async function remove(id) {
|
||||
async function remove({ id }) {
|
||||
await axios.delete(`ClaimRmas/${id}`);
|
||||
await arrayData.refresh();
|
||||
quasar.notify({
|
||||
type: 'positive',
|
||||
message: t('globals.rowRemoved'),
|
||||
icon: 'check',
|
||||
});
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<q-page class="q-pa-md sticky">
|
||||
<q-page class="column items-center q-pa-md sticky">
|
||||
<q-page-sticky expand position="top" :offset="[16, 16]">
|
||||
<q-card class="card q-pa-md">
|
||||
<q-form @submit="submit">
|
||||
|
@ -79,6 +81,7 @@ async function remove(id) {
|
|||
</q-form>
|
||||
</q-card>
|
||||
</q-page-sticky>
|
||||
<div class="card-list">
|
||||
<paginate
|
||||
data-key="ClaimRmaList"
|
||||
url="ClaimRmas"
|
||||
|
@ -105,7 +108,11 @@ async function remove(id) {
|
|||
</q-list>
|
||||
</q-item-section>
|
||||
<q-card-actions vertical class="justify-between">
|
||||
<q-skeleton type="circle" class="q-mb-md" size="40px" />
|
||||
<q-skeleton
|
||||
type="circle"
|
||||
class="q-mb-md"
|
||||
size="40px"
|
||||
/>
|
||||
</q-card-actions>
|
||||
</q-item>
|
||||
<q-separator />
|
||||
|
@ -119,7 +126,9 @@ async function remove(id) {
|
|||
<q-item-label caption>{{
|
||||
t('claim.rmaList.code')
|
||||
}}</q-item-label>
|
||||
<q-item-label>{{ row.code }}</q-item-label>
|
||||
<q-item-label>{{
|
||||
row.code
|
||||
}}</q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
|
@ -141,6 +150,7 @@ async function remove(id) {
|
|||
</q-card>
|
||||
</template>
|
||||
</paginate>
|
||||
</div>
|
||||
</q-page>
|
||||
</template>
|
||||
|
||||
|
@ -149,7 +159,7 @@ async function remove(id) {
|
|||
padding-top: 156px;
|
||||
}
|
||||
|
||||
.card {
|
||||
.card-list, .card {
|
||||
width: 100%;
|
||||
max-width: 60em;
|
||||
}
|
||||
|
|
|
@ -12,6 +12,7 @@ const { t } = useI18n();
|
|||
<Teleport to="#searchbar" v-if="stateStore.isHeaderMounted()">
|
||||
<VnSearchbar
|
||||
data-key="CustomerList"
|
||||
url="Clients/filter"
|
||||
:label="t('Search customer')"
|
||||
:info="t('You can search by customer id or name')"
|
||||
/>
|
||||
|
|
|
@ -9,7 +9,7 @@ const $props = defineProps({
|
|||
});
|
||||
</script>
|
||||
<template>
|
||||
<q-card>
|
||||
<customer-descriptor v-if="$props.id" :id="$props.id" />
|
||||
</q-card>
|
||||
<q-popup-proxy>
|
||||
<CustomerDescriptor v-if="$props.id" :id="$props.id" />
|
||||
</q-popup-proxy>
|
||||
</template>
|
|
@ -12,6 +12,7 @@ const { t } = useI18n();
|
|||
<Teleport to="#searchbar" v-if="stateStore.isHeaderMounted()">
|
||||
<VnSearchbar
|
||||
data-key="InvoiceOutList"
|
||||
url="InvoiceOuts/filter"
|
||||
:label="t('Search invoice')"
|
||||
:info="t('You can search by invoice reference')"
|
||||
/>
|
||||
|
|
|
@ -3,8 +3,8 @@ import { ref, computed } from 'vue';
|
|||
import { useRoute } from 'vue-router';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { toCurrency, toDate } from 'src/filters';
|
||||
import CardDescriptor from 'src/components/ui/CardDescriptor.vue';
|
||||
import CustomerDescriptorPopover from 'src/pages/Customer/Card/CustomerDescriptorPopover.vue';
|
||||
import CardDescriptor from 'components/ui/CardDescriptor.vue';
|
||||
import CustomerDescriptorProxy from 'pages/Customer/Card/CustomerDescriptorProxy.vue';
|
||||
|
||||
const $props = defineProps({
|
||||
id: {
|
||||
|
@ -80,9 +80,7 @@ function ticketFilter(invoice) {
|
|||
</q-item-label>
|
||||
<q-item-label class="link">
|
||||
{{ entity.client.name }}
|
||||
<q-popup-proxy>
|
||||
<customer-descriptor-popover :id="entity.client.id" />
|
||||
</q-popup-proxy>
|
||||
<CustomerDescriptorProxy :id="entity.client.id" />
|
||||
</q-item-label>
|
||||
</q-item-section>
|
||||
<q-item-section v-if="entity.company">
|
||||
|
|
|
@ -9,7 +9,7 @@ const $props = defineProps({
|
|||
});
|
||||
</script>
|
||||
<template>
|
||||
<q-card>
|
||||
<invoiceOut-descriptor v-if="$props.id" :id="$props.id" />
|
||||
</q-card>
|
||||
<q-popup-proxy>
|
||||
<InvoiceOutDescriptor v-if="$props.id" :id="$props.id" />
|
||||
</q-popup-proxy>
|
||||
</template>
|
|
@ -48,7 +48,6 @@ const password = ref('');
|
|||
const keepLogin = ref(true);
|
||||
|
||||
async function onSubmit() {
|
||||
try {
|
||||
const { data } = await axios.post('Accounts/login', {
|
||||
user: username.value,
|
||||
password: password.value,
|
||||
|
@ -69,9 +68,6 @@ async function onSubmit() {
|
|||
} else {
|
||||
router.push({ name: 'Dashboard' });
|
||||
}
|
||||
} catch (error) {
|
||||
//
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
|
@ -92,10 +88,20 @@ async function onSubmit() {
|
|||
>
|
||||
<q-menu auto-close>
|
||||
<q-list dense>
|
||||
<q-item @click="userLocale = 'en'" :active="userLocale == 'en'" v-ripple clickable>
|
||||
<q-item
|
||||
@click="userLocale = 'en'"
|
||||
:active="userLocale == 'en'"
|
||||
v-ripple
|
||||
clickable
|
||||
>
|
||||
{{ t('globals.lang.en') }}
|
||||
</q-item>
|
||||
<q-item @click="userLocale = 'es'" :active="userLocale == 'es'" v-ripple clickable>
|
||||
<q-item
|
||||
@click="userLocale = 'es'"
|
||||
:active="userLocale == 'es'"
|
||||
v-ripple
|
||||
clickable
|
||||
>
|
||||
{{ t('globals.lang.es') }}
|
||||
</q-item>
|
||||
</q-list>
|
||||
|
@ -104,30 +110,48 @@ async function onSubmit() {
|
|||
<q-list>
|
||||
<q-item>
|
||||
<q-item-section>
|
||||
<q-item-label caption>{{ t(`globals.darkMode`) }}</q-item-label>
|
||||
<q-item-label caption>{{
|
||||
t(`globals.darkMode`)
|
||||
}}</q-item-label>
|
||||
</q-item-section>
|
||||
<q-item-section side>
|
||||
<q-toggle v-model="darkMode" checked-icon="dark_mode" unchecked-icon="light_mode" />
|
||||
<q-toggle
|
||||
v-model="darkMode"
|
||||
checked-icon="dark_mode"
|
||||
unchecked-icon="light_mode"
|
||||
/>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-toolbar>
|
||||
</q-page-sticky>
|
||||
<div class="login-form q-pa-xl">
|
||||
<q-img src="~/assets/logo.svg" alt="Logo" fit="contain" :ratio="16 / 9" class="q-mb-md" />
|
||||
<q-img
|
||||
src="~/assets/logo.svg"
|
||||
alt="Logo"
|
||||
fit="contain"
|
||||
:ratio="16 / 9"
|
||||
class="q-mb-md"
|
||||
/>
|
||||
<q-form @submit="onSubmit" class="q-gutter-md">
|
||||
<q-input
|
||||
v-model="username"
|
||||
:label="t('login.username')"
|
||||
lazy-rules
|
||||
:rules="[(val) => (val && val.length > 0) || t('login.fieldRequired')]"
|
||||
:rules="[
|
||||
(val) =>
|
||||
(val && val.length > 0) || t('login.fieldRequired'),
|
||||
]"
|
||||
/>
|
||||
<q-input
|
||||
type="password"
|
||||
v-model="password"
|
||||
:label="t('login.password')"
|
||||
lazy-rules
|
||||
:rules="[(val) => (val && val.length > 0) || t('login.fieldRequired')]"
|
||||
:rules="[
|
||||
(val) =>
|
||||
(val && val.length > 0) || t('login.fieldRequired'),
|
||||
]"
|
||||
/>
|
||||
<q-toggle v-model="keepLogin" :label="t('login.keepLogin')" />
|
||||
|
||||
|
|
|
@ -12,6 +12,7 @@ const { t } = useI18n();
|
|||
<Teleport to="#searchbar" v-if="stateStore.isHeaderMounted()">
|
||||
<VnSearchbar
|
||||
data-key="TicketList"
|
||||
url="Tickets/filter"
|
||||
:label="t('Search ticket')"
|
||||
:info="t('You can search by ticket id or alias')"
|
||||
/>
|
||||
|
|
|
@ -3,8 +3,9 @@ import { computed } from 'vue';
|
|||
import { useRoute } from 'vue-router';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { toDate } from 'src/filters';
|
||||
import CustomerDescriptorPopover from 'src/pages/Customer/Card/CustomerDescriptorPopover.vue';
|
||||
import CustomerDescriptorProxy from 'pages/Customer/Card/CustomerDescriptorProxy.vue';
|
||||
import CardDescriptor from 'components/ui/CardDescriptor.vue';
|
||||
import TicketDescriptorMenu from './TicketDescriptorMenu.vue';
|
||||
|
||||
const $props = defineProps({
|
||||
id: {
|
||||
|
@ -23,11 +24,25 @@ const entityId = computed(() => {
|
|||
|
||||
const filter = {
|
||||
include: [
|
||||
{
|
||||
relation: 'address',
|
||||
scope: {
|
||||
fields: ['id', 'name', 'mobile', 'phone'],
|
||||
},
|
||||
},
|
||||
{
|
||||
relation: 'client',
|
||||
scope: {
|
||||
fields: ['id', 'name', 'salesPersonFk'],
|
||||
include: { relation: 'salesPersonUser' },
|
||||
fields: ['id', 'name', 'salesPersonFk', 'phone', 'mobile', 'email'],
|
||||
include: [
|
||||
{
|
||||
relation: 'user',
|
||||
scope: {
|
||||
fields: ['id', 'lang'],
|
||||
},
|
||||
},
|
||||
{ relation: 'salesPersonUser' },
|
||||
],
|
||||
},
|
||||
},
|
||||
{
|
||||
|
@ -61,6 +76,9 @@ function stateColor(state) {
|
|||
|
||||
<template>
|
||||
<card-descriptor module="Ticket" :url="`Tickets/${entityId}`" :filter="filter">
|
||||
<template #menu="{ entity }">
|
||||
<TicketDescriptorMenu :ticket="entity" />
|
||||
</template>
|
||||
<template #description="{ entity }">
|
||||
<span>
|
||||
{{ entity.client.name }}
|
||||
|
@ -91,9 +109,7 @@ function stateColor(state) {
|
|||
<q-item-label>
|
||||
<span class="link">
|
||||
{{ entity.clientFk }}
|
||||
<q-popup-proxy>
|
||||
<customer-descriptor-popover :id="entity.client.id" />
|
||||
</q-popup-proxy>
|
||||
<CustomerDescriptorProxy :id="entity.client.id" />
|
||||
</span>
|
||||
</q-item-label>
|
||||
</q-item-section>
|
||||
|
@ -121,6 +137,16 @@ function stateColor(state) {
|
|||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
<q-card-actions class="q-gutter-md">
|
||||
<q-icon
|
||||
v-if="entity.isDeleted == true"
|
||||
name="vn:deletedTicket"
|
||||
size="xs"
|
||||
color="primary"
|
||||
>
|
||||
<q-tooltip>{{ t('This ticket is deleted') }}</q-tooltip>
|
||||
</q-icon>
|
||||
</q-card-actions>
|
||||
|
||||
<q-card-actions>
|
||||
<q-btn
|
||||
|
@ -135,3 +161,8 @@ function stateColor(state) {
|
|||
</template>
|
||||
</card-descriptor>
|
||||
</template>
|
||||
|
||||
<i18n>
|
||||
es:
|
||||
This ticket is deleted: Este ticket está eliminado
|
||||
</i18n>
|
||||
|
|
|
@ -0,0 +1,256 @@
|
|||
<script setup>
|
||||
import axios from 'axios';
|
||||
import { ref } from 'vue';
|
||||
import { useQuasar } from 'quasar';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { useRouter, useRoute } from 'vue-router';
|
||||
import { usePrintService } from 'composables/usePrintService';
|
||||
import SendEmailDialog from 'components/common/SendEmailDialog.vue';
|
||||
import VnConfirm from 'components/ui/VnConfirm.vue';
|
||||
import VnSmsDialog from 'components/common/VnSmsDialog.vue';
|
||||
import toDate from 'filters/toDate';
|
||||
|
||||
const props = defineProps({
|
||||
ticket: {
|
||||
type: Object,
|
||||
required: true,
|
||||
},
|
||||
});
|
||||
|
||||
const router = useRouter();
|
||||
const route = useRoute();
|
||||
const quasar = useQuasar();
|
||||
const { t } = useI18n();
|
||||
const { openReport, sendEmail } = usePrintService();
|
||||
|
||||
const ticket = ref(props.ticket);
|
||||
|
||||
function openDeliveryNote(type = 'deliveryNote', documentType = 'pdf') {
|
||||
const path = `Tickets/${ticket.value.id}/delivery-note-${documentType}`;
|
||||
openReport(path, {
|
||||
recipientId: ticket.value.clientFk,
|
||||
type: type,
|
||||
});
|
||||
}
|
||||
|
||||
function sendDeliveryNoteConfirmation(type = 'deliveryNote', documentType = 'pdf') {
|
||||
const customer = ticket.value.client;
|
||||
quasar.dialog({
|
||||
component: SendEmailDialog,
|
||||
componentProps: {
|
||||
data: {
|
||||
address: customer.email,
|
||||
type: type,
|
||||
documentType: documentType,
|
||||
},
|
||||
promise: sendDeliveryNote,
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
async function sendDeliveryNote({ address, type, documentType }) {
|
||||
const id = ticket.value.id;
|
||||
const customer = ticket.value.client;
|
||||
let pathName = 'delivery-note-email';
|
||||
if (documentType == 'csv') pathName = 'delivery-note-csv-email';
|
||||
|
||||
const path = `Tickets/${id}/${pathName}`;
|
||||
return sendEmail(path, {
|
||||
recipientId: customer.id,
|
||||
recipient: address,
|
||||
type: type,
|
||||
});
|
||||
}
|
||||
|
||||
const shipped = toDate(ticket.value.shipped);
|
||||
function showSmsDialog(template, customData) {
|
||||
const address = ticket.value.address;
|
||||
const client = ticket.value.client;
|
||||
const phone =
|
||||
route.params.phone ||
|
||||
address.mobile ||
|
||||
address.phone ||
|
||||
client.mobile ||
|
||||
client.phone;
|
||||
|
||||
const data = {
|
||||
orderId: ticket.value.id,
|
||||
shipped: shipped,
|
||||
};
|
||||
|
||||
if (typeof customData === 'object') {
|
||||
Object.assign(data, customData);
|
||||
}
|
||||
|
||||
quasar.dialog({
|
||||
component: VnSmsDialog,
|
||||
componentProps: {
|
||||
phone: phone,
|
||||
template: template,
|
||||
locale: client.user.lang,
|
||||
data: data,
|
||||
promise: sendSms,
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
async function showSmsDialogWithChanges() {
|
||||
const query = `TicketLogs/${route.params.id}/getChanges`;
|
||||
const response = await axios.get(query);
|
||||
|
||||
showSmsDialog('orderChanges', { changes: response.data });
|
||||
}
|
||||
|
||||
async function sendSms(body) {
|
||||
await axios.post(`Tickets/${route.params.id}/sendSms`, body);
|
||||
quasar.notify({
|
||||
message: 'Notification sent',
|
||||
type: 'positive',
|
||||
});
|
||||
}
|
||||
|
||||
function confirmDelete() {
|
||||
quasar
|
||||
.dialog({
|
||||
component: VnConfirm,
|
||||
componentProps: {
|
||||
promise: remove,
|
||||
},
|
||||
})
|
||||
.onOk(async () => await router.push({ name: 'TicketList' }));
|
||||
}
|
||||
|
||||
async function remove() {
|
||||
const id = route.params.id;
|
||||
await axios.post(`Tickets/${id}/setDeleted`);
|
||||
|
||||
quasar.notify({
|
||||
message: t('Ticket deleted'),
|
||||
type: 'positive',
|
||||
});
|
||||
quasar.notify({
|
||||
message: t('You can undo this action within the first hour'),
|
||||
icon: 'info',
|
||||
});
|
||||
}
|
||||
</script>
|
||||
<template>
|
||||
<q-item v-ripple clickable>
|
||||
<q-item-section avatar>
|
||||
<q-icon name="picture_as_pdf" />
|
||||
</q-item-section>
|
||||
<q-item-section>{{ t('Open Delivery Note...') }}</q-item-section>
|
||||
<q-item-section side>
|
||||
<q-icon name="keyboard_arrow_right" />
|
||||
</q-item-section>
|
||||
<q-menu anchor="top end" self="top start" auto-close bordered>
|
||||
<q-list>
|
||||
<q-item @click="openDeliveryNote('deliveryNote')" v-ripple clickable>
|
||||
<q-item-section>{{ t('With prices') }}</q-item-section>
|
||||
</q-item>
|
||||
<q-item @click="openDeliveryNote('withoutPrices')" v-ripple clickable>
|
||||
<q-item-section>{{ t('Without prices') }}</q-item-section>
|
||||
</q-item>
|
||||
<q-item
|
||||
@click="openDeliveryNote('deliveryNote', 'csv')"
|
||||
v-ripple
|
||||
clickable
|
||||
>
|
||||
<q-item-section>{{ t('As CSV') }}</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-menu>
|
||||
</q-item>
|
||||
<q-item v-ripple clickable>
|
||||
<q-item-section avatar>
|
||||
<q-icon name="send" />
|
||||
</q-item-section>
|
||||
<q-item-section>{{ t('Send Delivery Note...') }}</q-item-section>
|
||||
<q-item-section side>
|
||||
<q-icon name="keyboard_arrow_right" />
|
||||
</q-item-section>
|
||||
<q-menu anchor="top end" self="top start" auto-close>
|
||||
<q-list>
|
||||
<q-item
|
||||
@click="sendDeliveryNoteConfirmation('deliveryNote')"
|
||||
v-ripple
|
||||
clickable
|
||||
>
|
||||
<q-item-section>{{ t('With prices') }}</q-item-section>
|
||||
</q-item>
|
||||
<q-item
|
||||
@click="sendDeliveryNoteConfirmation('withoutPrices')"
|
||||
v-ripple
|
||||
clickable
|
||||
>
|
||||
<q-item-section>{{ t('Without prices') }}</q-item-section>
|
||||
</q-item>
|
||||
<q-item
|
||||
@click="sendDeliveryNoteConfirmation('deliveryNote', 'csv')"
|
||||
v-ripple
|
||||
clickable
|
||||
>
|
||||
<q-item-section>{{ t('As CSV') }}</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-menu>
|
||||
</q-item>
|
||||
<q-item @click="openDeliveryNote('proforma')" v-ripple clickable>
|
||||
<q-item-section avatar>
|
||||
<q-icon name="receipt" />
|
||||
</q-item-section>
|
||||
<q-item-section>{{ t('Open Proforma Invoice') }}</q-item-section>
|
||||
</q-item>
|
||||
<q-item v-ripple clickable>
|
||||
<q-item-section avatar>
|
||||
<q-icon name="sms" />
|
||||
</q-item-section>
|
||||
<q-item-section>{{ t('Send SMS...') }}</q-item-section>
|
||||
<q-item-section side>
|
||||
<q-icon name="keyboard_arrow_right" />
|
||||
</q-item-section>
|
||||
<q-menu anchor="top end" self="top start" auto-close>
|
||||
<q-list>
|
||||
<q-item @click="showSmsDialog('pendingPayment')" v-ripple clickable>
|
||||
<q-item-section>{{ t('Pending payment') }}</q-item-section>
|
||||
</q-item>
|
||||
<q-item @click="showSmsDialog('minAmount')" v-ripple clickable>
|
||||
<q-item-section>{{ t('Minimum amount') }}</q-item-section>
|
||||
</q-item>
|
||||
<q-item
|
||||
@click="showSmsDialogWithChanges('orderChanges')"
|
||||
v-ripple
|
||||
clickable
|
||||
>
|
||||
<q-item-section>{{ t('Order changes') }}</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
</q-menu>
|
||||
</q-item>
|
||||
<template v-if="!ticket.isDeleted">
|
||||
<q-separator />
|
||||
<q-item @click="confirmDelete()" v-ripple clickable>
|
||||
<q-item-section avatar>
|
||||
<q-icon name="delete" />
|
||||
</q-item-section>
|
||||
<q-item-section>{{ t('Delete ticket') }}</q-item-section>
|
||||
</q-item>
|
||||
</template>
|
||||
</template>
|
||||
|
||||
<i18n>
|
||||
es:
|
||||
Open Delivery Note...: Abrir albarán...
|
||||
Send Delivery Note...: Enviar albarán...
|
||||
With prices: Con precios
|
||||
Without prices: Sin precios
|
||||
As CSV: Como CSV
|
||||
Open Proforma Invoice: Abrir factura proforma
|
||||
Delete ticket: Eliminar ticket
|
||||
Send SMS...: Enviar SMS
|
||||
Pending payment: Pago pendiente
|
||||
Minimum amount: Importe mínimo
|
||||
Order changes: Cambios del pedido
|
||||
Ticket deleted: Ticket eliminado
|
||||
You can undo this action within the first hour: Puedes deshacer esta acción dentro de la primera hora
|
||||
</i18n>
|
|
@ -9,7 +9,7 @@ const $props = defineProps({
|
|||
});
|
||||
</script>
|
||||
<template>
|
||||
<q-card>
|
||||
<ticket-descriptor v-if="$props.id" :id="$props.id" />
|
||||
</q-card>
|
||||
<q-popup-proxy>
|
||||
<TicketDescriptor v-if="$props.id" :id="$props.id" />
|
||||
</q-popup-proxy>
|
||||
</template>
|
|
@ -7,6 +7,8 @@ import { dashIfEmpty, toDate, toCurrency } from 'src/filters';
|
|||
import SkeletonSummary from 'components/ui/SkeletonSummary.vue';
|
||||
import FetchData from 'components/FetchData.vue';
|
||||
import FetchedTags from 'components/ui/FetchedTags.vue';
|
||||
import InvoiceOutDescriptorProxy from 'pages/InvoiceOut/Card/InvoiceOutDescriptorProxy.vue';
|
||||
import WorkerDescriptorProxy from 'pages/Worker/Card/WorkerDescriptorProxy.vue';
|
||||
|
||||
onMounted(() => fetch());
|
||||
onUpdated(() => fetch());
|
||||
|
@ -79,14 +81,20 @@ async function changeState(value) {
|
|||
</script>
|
||||
|
||||
<template>
|
||||
<fetch-data url="States/editableStates" @on-fetch="(data) => (editableStates = data)" auto-load />
|
||||
<fetch-data
|
||||
url="States/editableStates"
|
||||
@on-fetch="(data) => (editableStates = data)"
|
||||
auto-load
|
||||
/>
|
||||
<div class="summary container">
|
||||
<q-card>
|
||||
<skeleton-summary v-if="!ticket" />
|
||||
<template v-if="ticket">
|
||||
<div class="header bg-primary q-pa-sm q-mb-md">
|
||||
<span>
|
||||
Ticket #{{ ticket.id }} - {{ ticket.client.name }} ({{ ticket.client.id }}) -
|
||||
Ticket #{{ ticket.id }} - {{ ticket.client.name }} ({{
|
||||
ticket.client.id
|
||||
}}) -
|
||||
{{ ticket.nickname }}
|
||||
</span>
|
||||
<q-btn-dropdown
|
||||
|
@ -104,7 +112,13 @@ async function changeState(value) {
|
|||
separator
|
||||
v-slot="{ item, index }"
|
||||
>
|
||||
<q-item :key="index" dense clickable v-close-popup @click="changeState(item.code)">
|
||||
<q-item
|
||||
:key="index"
|
||||
dense
|
||||
clickable
|
||||
v-close-popup
|
||||
@click="changeState(item.code)"
|
||||
>
|
||||
<q-item-section>
|
||||
<q-item-label>{{ item.name }}</q-item-label>
|
||||
</q-item-section>
|
||||
|
@ -118,40 +132,72 @@ async function changeState(value) {
|
|||
<q-list>
|
||||
<q-item>
|
||||
<q-item-section>
|
||||
<q-item-label caption>{{ t('ticket.summary.state') }}</q-item-label>
|
||||
<q-item-label :class="stateColor(ticket.ticketState.state)">
|
||||
<q-item-label caption>{{
|
||||
t('ticket.summary.state')
|
||||
}}</q-item-label>
|
||||
<q-item-label
|
||||
:class="stateColor(ticket.ticketState.state)"
|
||||
>
|
||||
{{ ticket.ticketState.state.name }}
|
||||
</q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
<q-item>
|
||||
<q-item-section>
|
||||
<q-item-label caption>{{ t('ticket.summary.salesPerson') }}</q-item-label>
|
||||
<q-item-label class="link">{{ ticket.client.salesPersonUser.name }}</q-item-label>
|
||||
<q-item-label caption>{{
|
||||
t('ticket.summary.salesPerson')
|
||||
}}</q-item-label>
|
||||
<q-item-label>
|
||||
<span class="link">
|
||||
{{ ticket.client.salesPersonUser.name }}
|
||||
<WorkerDescriptorProxy
|
||||
:id="ticket.client.salesPersonFk"
|
||||
/>
|
||||
</span>
|
||||
</q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
<q-item>
|
||||
<q-item-section>
|
||||
<q-item-label caption>{{ t('ticket.summary.agency') }}</q-item-label>
|
||||
<q-item-label>{{ ticket.agencyMode.name }}</q-item-label>
|
||||
<q-item-label caption>{{
|
||||
t('ticket.summary.agency')
|
||||
}}</q-item-label>
|
||||
<q-item-label>{{
|
||||
ticket.agencyMode.name
|
||||
}}</q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
<q-item>
|
||||
<q-item-section>
|
||||
<q-item-label caption>{{ t('ticket.summary.zone') }}</q-item-label>
|
||||
<q-item-label class="link">{{ ticket.routeFk }}</q-item-label>
|
||||
<q-item-label caption>{{
|
||||
t('ticket.summary.zone')
|
||||
}}</q-item-label>
|
||||
<q-item-label class="link">{{
|
||||
ticket.routeFk
|
||||
}}</q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
<q-item>
|
||||
<q-item-section>
|
||||
<q-item-label caption>{{ t('ticket.summary.warehouse') }}</q-item-label>
|
||||
<q-item-label>{{ ticket.warehouse.name }}</q-item-label>
|
||||
<q-item-label caption>{{
|
||||
t('ticket.summary.warehouse')
|
||||
}}</q-item-label>
|
||||
<q-item-label>{{
|
||||
ticket.warehouse.name
|
||||
}}</q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
<q-item>
|
||||
<q-item-section>
|
||||
<q-item-label caption>{{ t('ticket.summary.invoice') }}</q-item-label>
|
||||
<q-item-label v-if="ticket.refFk" class="link">{{ ticket.refFk }}</q-item-label>
|
||||
<q-item-label caption>{{
|
||||
t('ticket.summary.invoice')
|
||||
}}</q-item-label>
|
||||
<q-item-label v-if="ticket.refFk">
|
||||
<span class="link">
|
||||
{{ ticket.refFk }}
|
||||
<InvoiceOutDescriptorProxy :id="ticket.id" />
|
||||
</span>
|
||||
</q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
|
@ -160,49 +206,75 @@ async function changeState(value) {
|
|||
<q-list>
|
||||
<q-item>
|
||||
<q-item-section>
|
||||
<q-item-label caption>{{ t('ticket.summary.shipped') }}</q-item-label>
|
||||
<q-item-label>{{ toDate(ticket.shipped) }}</q-item-label>
|
||||
<q-item-label caption>{{
|
||||
t('ticket.summary.shipped')
|
||||
}}</q-item-label>
|
||||
<q-item-label>{{
|
||||
toDate(ticket.shipped)
|
||||
}}</q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
<q-item>
|
||||
<q-item-section>
|
||||
<q-item-label caption>{{ t('ticket.summary.landed') }}</q-item-label>
|
||||
<q-item-label>{{ toDate(ticket.landed) }}</q-item-label>
|
||||
<q-item-label caption>{{
|
||||
t('ticket.summary.landed')
|
||||
}}</q-item-label>
|
||||
<q-item-label>{{
|
||||
toDate(ticket.landed)
|
||||
}}</q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
<q-item>
|
||||
<q-item-section>
|
||||
<q-item-label caption>{{ t('ticket.summary.packages') }}</q-item-label>
|
||||
<q-item-label caption>{{
|
||||
t('ticket.summary.packages')
|
||||
}}</q-item-label>
|
||||
<q-item-label>{{ ticket.packages }}</q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
<q-item>
|
||||
<q-item-section>
|
||||
<q-item-label caption>{{ t('ticket.summary.consigneePhone') }}</q-item-label>
|
||||
<q-item-label>{{ ticket.address.phone }}</q-item-label>
|
||||
<q-item-label caption>{{
|
||||
t('ticket.summary.consigneePhone')
|
||||
}}</q-item-label>
|
||||
<q-item-label>{{
|
||||
ticket.address.phone
|
||||
}}</q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
<q-item>
|
||||
<q-item-section>
|
||||
<q-item-label caption>{{ t('ticket.summary.consigneeMobile') }}</q-item-label>
|
||||
<q-item-label>{{ ticket.address.mobile }}</q-item-label>
|
||||
<q-item-label caption>{{
|
||||
t('ticket.summary.consigneeMobile')
|
||||
}}</q-item-label>
|
||||
<q-item-label>{{
|
||||
ticket.address.mobile
|
||||
}}</q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
<q-item>
|
||||
<q-item-section>
|
||||
<q-item-label caption>{{ t('ticket.summary.clientPhone') }}</q-item-label>
|
||||
<q-item-label caption>{{
|
||||
t('ticket.summary.clientPhone')
|
||||
}}</q-item-label>
|
||||
<q-item-label>{{ ticket.client.phone }}</q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
<q-item>
|
||||
<q-item-section>
|
||||
<q-item-label caption>{{ t('ticket.summary.clientMobile') }}</q-item-label>
|
||||
<q-item-label>{{ ticket.client.mobile }}</q-item-label>
|
||||
<q-item-label caption>{{
|
||||
t('ticket.summary.clientMobile')
|
||||
}}</q-item-label>
|
||||
<q-item-label>{{
|
||||
ticket.client.mobile
|
||||
}}</q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
<q-item>
|
||||
<q-item-section>
|
||||
<q-item-label caption>{{ t('ticket.summary.consignee') }}</q-item-label>
|
||||
<q-item-label caption>{{
|
||||
t('ticket.summary.consignee')
|
||||
}}</q-item-label>
|
||||
<q-item-label>{{ formattedAddress() }}</q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
|
@ -226,22 +298,34 @@ async function changeState(value) {
|
|||
<q-list class="taxes">
|
||||
<q-item>
|
||||
<q-item-section>
|
||||
<q-item-label caption>{{ t('ticket.summary.subtotal') }}</q-item-label>
|
||||
<q-item-label>{{ toCurrency(ticket.totalWithoutVat) }}</q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
<q-item>
|
||||
<q-item-section>
|
||||
<q-item-label caption>{{ t('ticket.summary.vat') }}</q-item-label>
|
||||
<q-item-label caption>{{
|
||||
t('ticket.summary.subtotal')
|
||||
}}</q-item-label>
|
||||
<q-item-label>{{
|
||||
toCurrency(ticket.totalWithVat - ticket.totalWithoutVat)
|
||||
toCurrency(ticket.totalWithoutVat)
|
||||
}}</q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
<q-item>
|
||||
<q-item-section>
|
||||
<q-item-label caption>{{ t('ticket.summary.total') }}</q-item-label>
|
||||
<q-item-label>{{ toCurrency(ticket.totalWithVat) }}</q-item-label>
|
||||
<q-item-label caption>{{
|
||||
t('ticket.summary.vat')
|
||||
}}</q-item-label>
|
||||
<q-item-label>{{
|
||||
toCurrency(
|
||||
ticket.totalWithVat - ticket.totalWithoutVat
|
||||
)
|
||||
}}</q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
<q-item>
|
||||
<q-item-section>
|
||||
<q-item-label caption>{{
|
||||
t('ticket.summary.total')
|
||||
}}</q-item-label>
|
||||
<q-item-label>{{
|
||||
toCurrency(ticket.totalWithVat)
|
||||
}}</q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
|
@ -253,7 +337,10 @@ async function changeState(value) {
|
|||
<q-item-label header class="text-h6">
|
||||
{{ t('ticket.summary.saleLines') }}
|
||||
<router-link
|
||||
:to="{ name: 'TicketBasicData', params: { id: entityId } }"
|
||||
:to="{
|
||||
name: 'TicketBasicData',
|
||||
params: { id: entityId },
|
||||
}"
|
||||
target="_blank"
|
||||
>
|
||||
<q-icon name="open_in_new" />
|
||||
|
@ -263,15 +350,33 @@ async function changeState(value) {
|
|||
<template #header="props">
|
||||
<q-tr :props="props">
|
||||
<q-th auto-width></q-th>
|
||||
<q-th auto-width>{{ t('ticket.summary.item') }}</q-th>
|
||||
<q-th auto-width>{{ t('ticket.summary.visible') }}</q-th>
|
||||
<q-th auto-width>{{ t('ticket.summary.available') }}</q-th>
|
||||
<q-th auto-width>{{ t('ticket.summary.quantity') }}</q-th>
|
||||
<q-th auto-width>{{ t('ticket.summary.description') }}</q-th>
|
||||
<q-th auto-width>{{ t('ticket.summary.price') }}</q-th>
|
||||
<q-th auto-width>{{ t('ticket.summary.discount') }}</q-th>
|
||||
<q-th auto-width>{{ t('ticket.summary.amount') }}</q-th>
|
||||
<q-th auto-width>{{ t('ticket.summary.packing') }}</q-th>
|
||||
<q-th auto-width>{{
|
||||
t('ticket.summary.item')
|
||||
}}</q-th>
|
||||
<q-th auto-width>{{
|
||||
t('ticket.summary.visible')
|
||||
}}</q-th>
|
||||
<q-th auto-width>{{
|
||||
t('ticket.summary.available')
|
||||
}}</q-th>
|
||||
<q-th auto-width>{{
|
||||
t('ticket.summary.quantity')
|
||||
}}</q-th>
|
||||
<q-th auto-width>{{
|
||||
t('ticket.summary.description')
|
||||
}}</q-th>
|
||||
<q-th auto-width>{{
|
||||
t('ticket.summary.price')
|
||||
}}</q-th>
|
||||
<q-th auto-width>{{
|
||||
t('ticket.summary.discount')
|
||||
}}</q-th>
|
||||
<q-th auto-width>{{
|
||||
t('ticket.summary.amount')
|
||||
}}</q-th>
|
||||
<q-th auto-width>{{
|
||||
t('ticket.summary.packing')
|
||||
}}</q-th>
|
||||
</q-tr>
|
||||
</template>
|
||||
<template #body="props">
|
||||
|
@ -284,11 +389,18 @@ async function changeState(value) {
|
|||
icon="vn:claims"
|
||||
v-if="props.row.claim"
|
||||
color="primary"
|
||||
:to="{ name: 'ClaimCard', params: { id: props.row.claim.claimFk } }"
|
||||
:to="{
|
||||
name: 'ClaimCard',
|
||||
params: {
|
||||
id: props.row.claim.claimFk,
|
||||
},
|
||||
}"
|
||||
>
|
||||
<q-tooltip
|
||||
>{{ t('ticket.summary.claim') }}:
|
||||
{{ props.row.claim.claimFk }}</q-tooltip
|
||||
{{
|
||||
props.row.claim.claimFk
|
||||
}}</q-tooltip
|
||||
>
|
||||
</q-btn>
|
||||
<q-btn
|
||||
|
@ -300,12 +412,17 @@ async function changeState(value) {
|
|||
color="primary"
|
||||
:to="{
|
||||
name: 'ClaimCard',
|
||||
params: { id: props.row.claimBeginning.claimFk },
|
||||
params: {
|
||||
id: props.row.claimBeginning
|
||||
.claimFk,
|
||||
},
|
||||
}"
|
||||
>
|
||||
<q-tooltip
|
||||
>{{ t('ticket.summary.claim') }}:
|
||||
{{ props.row.claimBeginning.claimFk }}</q-tooltip
|
||||
{{
|
||||
props.row.claimBeginning.claimFk
|
||||
}}</q-tooltip
|
||||
>
|
||||
</q-btn>
|
||||
<q-icon
|
||||
|
@ -325,7 +442,9 @@ async function changeState(value) {
|
|||
size="xs"
|
||||
color="primary"
|
||||
>
|
||||
<q-tooltip>{{ t('ticket.summary.reserved') }}</q-tooltip>
|
||||
<q-tooltip>{{
|
||||
t('ticket.summary.reserved')
|
||||
}}</q-tooltip>
|
||||
</q-icon>
|
||||
<q-icon
|
||||
name="vn:unavailable"
|
||||
|
@ -333,7 +452,9 @@ async function changeState(value) {
|
|||
size="xs"
|
||||
color="primary"
|
||||
>
|
||||
<q-tooltip>{{ t('ticket.summary.itemShortage') }}</q-tooltip>
|
||||
<q-tooltip>{{
|
||||
t('ticket.summary.itemShortage')
|
||||
}}</q-tooltip>
|
||||
</q-icon>
|
||||
<q-icon
|
||||
name="vn:components"
|
||||
|
@ -341,7 +462,9 @@ async function changeState(value) {
|
|||
size="xs"
|
||||
color="primary"
|
||||
>
|
||||
<q-tooltip>{{ t('ticket.summary.hasComponentLack') }}</q-tooltip>
|
||||
<q-tooltip>{{
|
||||
t('ticket.summary.hasComponentLack')
|
||||
}}</q-tooltip>
|
||||
</q-icon>
|
||||
</q-td>
|
||||
<q-td class="link">{{ props.row.itemFk }}</q-td>
|
||||
|
@ -351,11 +474,16 @@ async function changeState(value) {
|
|||
<q-td>
|
||||
<div class="fetched-tags">
|
||||
<span>{{ props.row.item.name }}</span>
|
||||
<span v-if="props.row.item.subName" class="subName">{{
|
||||
props.row.item.subName
|
||||
}}</span>
|
||||
<span
|
||||
v-if="props.row.item.subName"
|
||||
class="subName"
|
||||
>{{ props.row.item.subName }}</span
|
||||
>
|
||||
</div>
|
||||
<fetched-tags :item="props.row.item" :max-length="5"></fetched-tags>
|
||||
<fetched-tags
|
||||
:item="props.row.item"
|
||||
:max-length="5"
|
||||
></fetched-tags>
|
||||
</q-td>
|
||||
<q-td>{{ props.row.price }}</q-td>
|
||||
<q-td>{{ props.row.discount }} %</q-td>
|
||||
|
@ -368,14 +496,19 @@ async function changeState(value) {
|
|||
)
|
||||
}}
|
||||
</q-td>
|
||||
<q-td>{{ dashIfEmpty(props.row.item.itemPackingTypeFk) }}</q-td>
|
||||
<q-td>{{
|
||||
dashIfEmpty(props.row.item.itemPackingTypeFk)
|
||||
}}</q-td>
|
||||
</q-tr>
|
||||
</template>
|
||||
</q-table>
|
||||
</q-list>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row q-pa-md" v-if="ticket.packagings.length > 0 || ticket.services.length > 0">
|
||||
<div
|
||||
class="row q-pa-md"
|
||||
v-if="ticket.packagings.length > 0 || ticket.services.length > 0"
|
||||
>
|
||||
<div class="col" v-if="ticket.packagings.length > 0">
|
||||
<q-list>
|
||||
<q-item-label header class="text-h6">
|
||||
|
@ -385,9 +518,15 @@ async function changeState(value) {
|
|||
<q-table :rows="ticket.packagings" flat>
|
||||
<template #header="props">
|
||||
<q-tr :props="props">
|
||||
<q-th auto-width>{{ t('ticket.summary.created') }}</q-th>
|
||||
<q-th auto-width>{{ t('ticket.summary.package') }}</q-th>
|
||||
<q-th auto-width>{{ t('ticket.summary.quantity') }}</q-th>
|
||||
<q-th auto-width>{{
|
||||
t('ticket.summary.created')
|
||||
}}</q-th>
|
||||
<q-th auto-width>{{
|
||||
t('ticket.summary.package')
|
||||
}}</q-th>
|
||||
<q-th auto-width>{{
|
||||
t('ticket.summary.quantity')
|
||||
}}</q-th>
|
||||
</q-tr>
|
||||
</template>
|
||||
<template #body="props">
|
||||
|
@ -409,11 +548,21 @@ async function changeState(value) {
|
|||
<q-table :rows="ticket.services" flat>
|
||||
<template #header="props">
|
||||
<q-tr :props="props">
|
||||
<q-th auto-width>{{ t('ticket.summary.quantity') }}</q-th>
|
||||
<q-th auto-width>{{ t('ticket.summary.description') }}</q-th>
|
||||
<q-th auto-width>{{ t('ticket.summary.price') }}</q-th>
|
||||
<q-th auto-width>{{ t('ticket.summary.taxClass') }}</q-th>
|
||||
<q-th auto-width>{{ t('ticket.summary.amount') }}</q-th>
|
||||
<q-th auto-width>{{
|
||||
t('ticket.summary.quantity')
|
||||
}}</q-th>
|
||||
<q-th auto-width>{{
|
||||
t('ticket.summary.description')
|
||||
}}</q-th>
|
||||
<q-th auto-width>{{
|
||||
t('ticket.summary.price')
|
||||
}}</q-th>
|
||||
<q-th auto-width>{{
|
||||
t('ticket.summary.taxClass')
|
||||
}}</q-th>
|
||||
<q-th auto-width>{{
|
||||
t('ticket.summary.amount')
|
||||
}}</q-th>
|
||||
</q-tr>
|
||||
</template>
|
||||
<template #body="props">
|
||||
|
@ -422,7 +571,11 @@ async function changeState(value) {
|
|||
<q-td>{{ props.row.description }}</q-td>
|
||||
<q-td>{{ toCurrency(props.row.price) }}</q-td>
|
||||
<q-td>{{ props.row.taxClass.description }}</q-td>
|
||||
<q-td>{{ toCurrency(props.row.quantity * props.row.price) }}</q-td>
|
||||
<q-td>{{
|
||||
toCurrency(
|
||||
props.row.quantity * props.row.price
|
||||
)
|
||||
}}</q-td>
|
||||
</q-tr>
|
||||
</template>
|
||||
</q-table>
|
||||
|
@ -439,13 +592,27 @@ async function changeState(value) {
|
|||
<q-table :rows="ticket.requests" flat>
|
||||
<template #header="props">
|
||||
<q-tr :props="props">
|
||||
<q-th auto-width>{{ t('ticket.summary.description') }}</q-th>
|
||||
<q-th auto-width>{{ t('ticket.summary.created') }}</q-th>
|
||||
<q-th auto-width>{{ t('ticket.summary.requester') }}</q-th>
|
||||
<q-th auto-width>{{ t('ticket.summary.atender') }}</q-th>
|
||||
<q-th auto-width>{{ t('ticket.summary.quantity') }}</q-th>
|
||||
<q-th auto-width>{{ t('ticket.summary.price') }}</q-th>
|
||||
<q-th auto-width>{{ t('ticket.summary.item') }}</q-th>
|
||||
<q-th auto-width>{{
|
||||
t('ticket.summary.description')
|
||||
}}</q-th>
|
||||
<q-th auto-width>{{
|
||||
t('ticket.summary.created')
|
||||
}}</q-th>
|
||||
<q-th auto-width>{{
|
||||
t('ticket.summary.requester')
|
||||
}}</q-th>
|
||||
<q-th auto-width>{{
|
||||
t('ticket.summary.atender')
|
||||
}}</q-th>
|
||||
<q-th auto-width>{{
|
||||
t('ticket.summary.quantity')
|
||||
}}</q-th>
|
||||
<q-th auto-width>{{
|
||||
t('ticket.summary.price')
|
||||
}}</q-th>
|
||||
<q-th auto-width>{{
|
||||
t('ticket.summary.item')
|
||||
}}</q-th>
|
||||
<q-th auto-width>Ok</q-th>
|
||||
</q-tr>
|
||||
</template>
|
||||
|
@ -458,8 +625,14 @@ async function changeState(value) {
|
|||
<q-td>{{ props.row.quantity }}</q-td>
|
||||
<q-td>{{ toCurrency(props.row.price) }}</q-td>
|
||||
<q-td v-if="!props.row.sale">-</q-td>
|
||||
<q-td v-if="props.row.sale" class="link">{{ props.row.sale.itemFk }}</q-td>
|
||||
<q-td><q-checkbox v-model="props.row.isOk" :disable="true" /></q-td>
|
||||
<q-td v-if="props.row.sale" class="link">{{
|
||||
props.row.sale.itemFk
|
||||
}}</q-td>
|
||||
<q-td
|
||||
><q-checkbox
|
||||
v-model="props.row.isOk"
|
||||
:disable="true"
|
||||
/></q-td>
|
||||
</q-tr>
|
||||
</template>
|
||||
</q-table>
|
||||
|
|
|
@ -3,6 +3,7 @@ import { ref } from 'vue';
|
|||
import { useI18n } from 'vue-i18n';
|
||||
import FetchData from 'components/FetchData.vue';
|
||||
import VnFilterPanel from 'src/components/ui/VnFilterPanel.vue';
|
||||
import toDateString from 'filters/toDateString';
|
||||
|
||||
const { t } = useI18n();
|
||||
const props = defineProps({
|
||||
|
@ -12,6 +13,15 @@ const props = defineProps({
|
|||
},
|
||||
});
|
||||
|
||||
const from = Date.vnNew()
|
||||
const to = Date.vnNew();
|
||||
to.setDate(to.getDate() + 1)
|
||||
|
||||
const defaultParams = {
|
||||
from: toDateString(from),
|
||||
to: toDateString(to),
|
||||
};
|
||||
|
||||
const workers = ref();
|
||||
const provinces = ref();
|
||||
const states = ref();
|
||||
|
@ -30,7 +40,11 @@ const warehouses = ref();
|
|||
@on-fetch="(data) => (workers = data)"
|
||||
auto-load
|
||||
/>
|
||||
<VnFilterPanel :data-key="props.dataKey" :search-button="true">
|
||||
<VnFilterPanel
|
||||
:data-key="props.dataKey"
|
||||
:params="defaultParams"
|
||||
:search-button="true"
|
||||
>
|
||||
<template #tags="{ tag, formatFn }">
|
||||
<div class="q-gutter-x-xs">
|
||||
<strong>{{ t(`params.${tag.label}`) }}: </strong>
|
||||
|
@ -57,7 +71,7 @@ const warehouses = ref();
|
|||
</q-item>
|
||||
<q-item>
|
||||
<q-item-section>
|
||||
<q-input v-model="params.dateFrom" :label="t('From')" mask="date">
|
||||
<q-input v-model="params.from" :label="t('From')" mask="date">
|
||||
<template #append>
|
||||
<q-icon name="event" class="cursor-pointer">
|
||||
<q-popup-proxy
|
||||
|
@ -65,7 +79,7 @@ const warehouses = ref();
|
|||
transition-show="scale"
|
||||
transition-hide="scale"
|
||||
>
|
||||
<q-date v-model="params.dateFrom" landscape>
|
||||
<q-date v-model="params.from" landscape>
|
||||
<div
|
||||
class="row items-center justify-end q-gutter-sm"
|
||||
>
|
||||
|
@ -79,7 +93,6 @@ const warehouses = ref();
|
|||
:label="t('globals.confirm')"
|
||||
color="primary"
|
||||
flat
|
||||
@click="save"
|
||||
v-close-popup
|
||||
/>
|
||||
</div>
|
||||
|
@ -90,7 +103,7 @@ const warehouses = ref();
|
|||
</q-input>
|
||||
</q-item-section>
|
||||
<q-item-section>
|
||||
<q-input v-model="params.dateTo" :label="t('To')" mask="date">
|
||||
<q-input v-model="params.to" :label="t('To')" mask="date">
|
||||
<template #append>
|
||||
<q-icon name="event" class="cursor-pointer">
|
||||
<q-popup-proxy
|
||||
|
@ -98,7 +111,7 @@ const warehouses = ref();
|
|||
transition-show="scale"
|
||||
transition-hide="scale"
|
||||
>
|
||||
<q-date v-model="params.dateTo" landscape>
|
||||
<q-date v-model="params.to" landscape>
|
||||
<div
|
||||
class="row items-center justify-end q-gutter-sm"
|
||||
>
|
||||
|
@ -278,8 +291,8 @@ en:
|
|||
search: Contains
|
||||
clientFk: Customer
|
||||
orderFK: Order
|
||||
dateFrom: From
|
||||
dateTo: To
|
||||
from: From
|
||||
to: To
|
||||
salesPersonFk: Salesperson
|
||||
stateFk: State
|
||||
refFk: Invoice Ref.
|
||||
|
@ -295,8 +308,8 @@ es:
|
|||
search: Contiene
|
||||
clientFk: Cliente
|
||||
orderFK: Pedido
|
||||
dateFrom: Desde
|
||||
dateTo: Hasta
|
||||
from: Desde
|
||||
to: Hasta
|
||||
salesPersonFk: Comercial
|
||||
stateFk: Estado
|
||||
refFk: Ref. Factura
|
||||
|
|
|
@ -5,7 +5,7 @@ import { useQuasar } from 'quasar';
|
|||
import { useRouter } from 'vue-router';
|
||||
import { useStateStore } from 'stores/useStateStore';
|
||||
import Paginate from 'src/components/PaginateData.vue';
|
||||
import { toDate, toCurrency } from 'src/filters/index';
|
||||
import { toDate, toDateString, toCurrency } from 'src/filters/index';
|
||||
import TicketSummaryDialog from './Card/TicketSummaryDialog.vue';
|
||||
import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
|
||||
import TicketFilter from './TicketFilter.vue';
|
||||
|
@ -46,6 +46,15 @@ const filter = {
|
|||
],
|
||||
};
|
||||
|
||||
const from = Date.vnNew();
|
||||
const to = Date.vnNew();
|
||||
to.setDate(to.getDate() + 1);
|
||||
|
||||
const userParams = {
|
||||
from: toDateString(from),
|
||||
to: toDateString(to),
|
||||
};
|
||||
|
||||
function stateColor(row) {
|
||||
if (row.alertLevelCode === 'OK') return 'green';
|
||||
if (row.alertLevelCode === 'FREE') return 'blue-3';
|
||||
|
@ -104,6 +113,7 @@ function viewSummary(id) {
|
|||
data-key="TicketList"
|
||||
url="Tickets/filter"
|
||||
:filter="filter"
|
||||
:user-params="userParams"
|
||||
order="id DESC"
|
||||
auto-load
|
||||
>
|
||||
|
@ -123,9 +133,9 @@ function viewSummary(id) {
|
|||
<q-item-label caption>
|
||||
{{ t('ticket.list.nickname') }}
|
||||
</q-item-label>
|
||||
<q-item-label>{{
|
||||
row.nickname
|
||||
}}</q-item-label>
|
||||
<q-item-label>
|
||||
{{ row.nickname }}
|
||||
</q-item-label>
|
||||
</q-item-section>
|
||||
<q-item-section>
|
||||
<q-item-label caption>
|
||||
|
|
|
@ -12,6 +12,7 @@ const { t } = useI18n();
|
|||
<Teleport to="#searchbar" v-if="stateStore.isHeaderMounted()">
|
||||
<VnSearchbar
|
||||
data-key="WorkerList"
|
||||
url="Workers/filter"
|
||||
:label="t('Search worker')"
|
||||
:info="t('You can search by worker id or name')"
|
||||
/>
|
||||
|
|
|
@ -1,5 +1,10 @@
|
|||
import { route } from 'quasar/wrappers';
|
||||
import { createRouter, createMemoryHistory, createWebHistory, createWebHashHistory } from 'vue-router';
|
||||
import {
|
||||
createRouter,
|
||||
createMemoryHistory,
|
||||
createWebHistory,
|
||||
createWebHashHistory,
|
||||
} from 'vue-router';
|
||||
import routes from './routes';
|
||||
import { i18n } from 'src/boot/i18n';
|
||||
import { useState } from 'src/composables/useState';
|
||||
|
@ -12,16 +17,6 @@ const session = useSession();
|
|||
const role = useRole();
|
||||
const { t } = i18n.global;
|
||||
|
||||
/*
|
||||
* If not building with SSR mode, you can
|
||||
* directly export the Router instantiation;
|
||||
*
|
||||
* The function below can be async too; either use
|
||||
* async/await or return a Promise which resolves
|
||||
* with the Router instance.
|
||||
*/
|
||||
|
||||
export default route(function (/* { store, ssrContext } */) {
|
||||
const createHistory = process.env.SERVER
|
||||
? createMemoryHistory
|
||||
: process.env.VUE_ROUTER_MODE === 'history'
|
||||
|
@ -38,6 +33,16 @@ export default route(function (/* { store, ssrContext } */) {
|
|||
history: createHistory(process.env.VUE_ROUTER_BASE),
|
||||
});
|
||||
|
||||
/*
|
||||
* If not building with SSR mode, you can
|
||||
* directly export the Router instantiation;
|
||||
*
|
||||
* The function below can be async too; either use
|
||||
* async/await or return a Promise which resolves
|
||||
* with the Router instance.
|
||||
*/
|
||||
export { Router };
|
||||
export default route(function (/* { store, ssrContext } */) {
|
||||
Router.beforeEach(async (to, from, next) => {
|
||||
const { isLoggedIn } = session;
|
||||
|
||||
|
|
|
@ -1,70 +0,0 @@
|
|||
import { vi, describe, expect, it, beforeAll } from 'vitest';
|
||||
import { createWrapper } from 'app/test/vitest/helper';
|
||||
import App from 'src/App.vue';
|
||||
import { useSession } from 'src/composables/useSession';
|
||||
|
||||
const mockLoggedIn = vi.fn();
|
||||
const mockDestroy = vi.fn();
|
||||
const session = useSession();
|
||||
|
||||
vi.mock('src/composables/useSession', () => ({
|
||||
useSession: () => ({
|
||||
isLoggedIn: mockLoggedIn,
|
||||
destroy: mockDestroy,
|
||||
}),
|
||||
}));
|
||||
|
||||
describe('App', () => {
|
||||
let vm;
|
||||
|
||||
beforeAll(() => {
|
||||
const options = {
|
||||
global: {
|
||||
stubs: ['router-view'],
|
||||
},
|
||||
};
|
||||
vm = createWrapper(App, options).vm;
|
||||
});
|
||||
|
||||
it('should return a login error message', async () => {
|
||||
vi.spyOn(vm.quasar, 'notify');
|
||||
|
||||
session.isLoggedIn.mockReturnValue(false);
|
||||
|
||||
const response = {
|
||||
response: {
|
||||
status: 401,
|
||||
},
|
||||
};
|
||||
|
||||
expect(vm.responseError(response)).rejects.toEqual(expect.objectContaining(response));
|
||||
expect(vm.quasar.notify).toHaveBeenCalledWith(
|
||||
expect.objectContaining({
|
||||
message: 'Invalid username or password',
|
||||
type: 'negative',
|
||||
})
|
||||
);
|
||||
});
|
||||
|
||||
it('should return an unauthorized error message', async () => {
|
||||
vi.spyOn(vm.quasar, 'notify');
|
||||
|
||||
session.isLoggedIn.mockReturnValue(true);
|
||||
|
||||
const response = {
|
||||
response: {
|
||||
status: 401,
|
||||
},
|
||||
};
|
||||
|
||||
expect(vm.responseError(response)).rejects.toEqual(expect.objectContaining(response));
|
||||
expect(vm.quasar.notify).toHaveBeenCalledWith(
|
||||
expect.objectContaining({
|
||||
message: 'Access denied',
|
||||
type: 'negative',
|
||||
})
|
||||
);
|
||||
|
||||
expect(session.destroy).toHaveBeenCalled();
|
||||
});
|
||||
});
|
|
@ -0,0 +1,81 @@
|
|||
import { vi, describe, expect, it } from 'vitest';
|
||||
import { onRequest, onResponseError } from 'src/boot/axios';
|
||||
import { Notify } from 'quasar'
|
||||
|
||||
vi.mock('src/composables/useSession', () => ({
|
||||
useSession: () => ({
|
||||
getToken: () => 'DEFAULT_TOKEN'
|
||||
}),
|
||||
}));
|
||||
|
||||
vi.mock('src/router', () => ({}));
|
||||
|
||||
describe('Axios boot', () => {
|
||||
|
||||
describe('onRequest()', async () => {
|
||||
it('should set the "Authorization" property on the headers', async () => {
|
||||
const config = { headers: {} };
|
||||
|
||||
const resultConfig = onRequest(config);
|
||||
|
||||
expect(resultConfig).toEqual(expect.objectContaining({
|
||||
headers: {
|
||||
Authorization: 'DEFAULT_TOKEN'
|
||||
}
|
||||
}));
|
||||
});
|
||||
})
|
||||
|
||||
describe('onResponseError()', async () => {
|
||||
it('should call to the Notify plugin with a message error for an status code "500"', async () => {
|
||||
Notify.create = vi.fn()
|
||||
|
||||
const error = {
|
||||
response: {
|
||||
status: 500
|
||||
}
|
||||
};
|
||||
|
||||
const result = onResponseError(error);
|
||||
|
||||
|
||||
expect(result).rejects.toEqual(
|
||||
expect.objectContaining(error)
|
||||
);
|
||||
expect(Notify.create).toHaveBeenCalledWith(
|
||||
expect.objectContaining({
|
||||
message: 'An internal server error has ocurred',
|
||||
type: 'negative',
|
||||
})
|
||||
);
|
||||
});
|
||||
|
||||
it('should call to the Notify plugin with a message from the response property', async () => {
|
||||
Notify.create = vi.fn()
|
||||
|
||||
const error = {
|
||||
response: {
|
||||
status: 401,
|
||||
data: {
|
||||
error: {
|
||||
message: 'Invalid user or password'
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
const result = onResponseError(error);
|
||||
|
||||
|
||||
expect(result).rejects.toEqual(
|
||||
expect.objectContaining(error)
|
||||
);
|
||||
expect(Notify.create).toHaveBeenCalledWith(
|
||||
expect.objectContaining({
|
||||
message: 'Invalid user or password',
|
||||
type: 'negative',
|
||||
})
|
||||
);
|
||||
});
|
||||
})
|
||||
});
|
|
@ -18,12 +18,12 @@ describe('ClaimDescriptorMenu', () => {
|
|||
vi.clearAllMocks();
|
||||
});
|
||||
|
||||
describe('deleteClaim()', () => {
|
||||
describe('remove()', () => {
|
||||
it('should delete the claim', async () => {
|
||||
vi.spyOn(axios, 'delete').mockResolvedValue({ data: true });
|
||||
vi.spyOn(vm.quasar, 'notify');
|
||||
|
||||
await vm.deleteClaim();
|
||||
await vm.remove();
|
||||
|
||||
expect(vm.quasar.notify).toHaveBeenCalledWith(
|
||||
expect.objectContaining({ type: 'positive' })
|
||||
|
|
|
@ -21,7 +21,7 @@ describe('ClaimPhoto', () => {
|
|||
beforeAll(() => {
|
||||
vm = createWrapper(ClaimPhoto, {
|
||||
global: {
|
||||
stubs: ['FetchData', 'TeleportSlot', 'vue-i18n'],
|
||||
stubs: ['FetchData', 'vue-i18n'],
|
||||
mocks: {
|
||||
fetch: vi.fn(),
|
||||
},
|
||||
|
@ -38,7 +38,7 @@ describe('ClaimPhoto', () => {
|
|||
vi.spyOn(axios, 'post').mockResolvedValue({ data: true });
|
||||
vi.spyOn(vm.quasar, 'notify');
|
||||
|
||||
await vm.deleteDms(0);
|
||||
await vm.deleteDms({ index: 0 });
|
||||
|
||||
expect(axios.post).toHaveBeenCalledWith(
|
||||
`ClaimDms/${claimMock.claimDms[0].dmsFk}/removeFile`
|
||||
|
@ -46,7 +46,6 @@ describe('ClaimPhoto', () => {
|
|||
expect(vm.quasar.notify).toHaveBeenCalledWith(
|
||||
expect.objectContaining({ type: 'positive' })
|
||||
);
|
||||
expect(vm.claimDms).toEqual([]);
|
||||
});
|
||||
});
|
||||
|
||||
|
@ -59,8 +58,10 @@ describe('ClaimPhoto', () => {
|
|||
expect(vm.quasar.dialog).toHaveBeenCalledWith(
|
||||
expect.objectContaining({
|
||||
componentProps: {
|
||||
message: 'This file will be deleted',
|
||||
title: 'This file will be deleted',
|
||||
icon: 'delete',
|
||||
data: { index: 1 },
|
||||
promise: vm.deleteDms
|
||||
},
|
||||
})
|
||||
);
|
||||
|
|
|
@ -23,7 +23,9 @@ describe('Login', () => {
|
|||
},
|
||||
};
|
||||
vi.spyOn(axios, 'post').mockResolvedValue({ data: { token: 'token' } });
|
||||
vi.spyOn(axios, 'get').mockResolvedValue({ data: { roles: [], user: expectedUser } });
|
||||
vi.spyOn(axios, 'get').mockResolvedValue({
|
||||
data: { roles: [], user: expectedUser },
|
||||
});
|
||||
vi.spyOn(vm.quasar, 'notify');
|
||||
|
||||
expect(vm.session.getToken()).toEqual('');
|
||||
|
@ -31,7 +33,9 @@ describe('Login', () => {
|
|||
await vm.onSubmit();
|
||||
|
||||
expect(vm.session.getToken()).toEqual('token');
|
||||
expect(vm.quasar.notify).toHaveBeenCalledWith(expect.objectContaining({ type: 'positive' }));
|
||||
expect(vm.quasar.notify).toHaveBeenCalledWith(
|
||||
expect.objectContaining({ type: 'positive' })
|
||||
);
|
||||
vm.session.destroy();
|
||||
});
|
||||
|
||||
|
|
Loading…
Reference in New Issue