forked from verdnatura/salix-front
Merge branch 'dev' of https://gitea.verdnatura.es/verdnatura/salix-front into 6899-endInvoiceOutMigration
This commit is contained in:
commit
ca3b280dcb
|
|
@ -5,6 +5,8 @@ All notable changes to this project will be documented in this file.
|
|||
The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
|
||||
and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
|
||||
|
||||
## [2420.01]
|
||||
|
||||
## [2418.01]
|
||||
|
||||
## [2416.01] - 2024-04-18
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "salix-front",
|
||||
"version": "24.18.0",
|
||||
"version": "24.20.0",
|
||||
"description": "Salix frontend",
|
||||
"productName": "Salix",
|
||||
"author": "Verdnatura",
|
||||
|
|
|
|||
14490
pnpm-lock.yaml
14490
pnpm-lock.yaml
File diff suppressed because it is too large
Load Diff
|
|
@ -102,7 +102,7 @@ onMounted(async () => {
|
|||
});
|
||||
|
||||
onBeforeRouteLeave((to, from, next) => {
|
||||
if (hasChanges.value)
|
||||
if (hasChanges.value && $props.observeFormChanges)
|
||||
quasar.dialog({
|
||||
component: VnConfirm,
|
||||
componentProps: {
|
||||
|
|
|
|||
|
|
@ -76,6 +76,16 @@ defineExpose({
|
|||
<p>{{ subtitle }}</p>
|
||||
<slot name="form-inputs" :data="data" :validate="validate" />
|
||||
<div class="q-mt-lg row justify-end">
|
||||
<QBtn
|
||||
:label="t('globals.cancel')"
|
||||
:title="t('globals.cancel')"
|
||||
type="reset"
|
||||
color="primary"
|
||||
flat
|
||||
:disabled="isLoading"
|
||||
:loading="isLoading"
|
||||
v-close-popup
|
||||
/>
|
||||
<QBtn
|
||||
:label="t('globals.save')"
|
||||
:title="t('globals.save')"
|
||||
|
|
@ -84,17 +94,6 @@ defineExpose({
|
|||
:disabled="isLoading"
|
||||
:loading="isLoading"
|
||||
/>
|
||||
<QBtn
|
||||
:label="t('globals.cancel')"
|
||||
:title="t('globals.cancel')"
|
||||
type="reset"
|
||||
color="primary"
|
||||
flat
|
||||
class="q-ml-sm"
|
||||
:disabled="isLoading"
|
||||
:loading="isLoading"
|
||||
v-close-popup
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
</FormModel>
|
||||
|
|
|
|||
|
|
@ -56,14 +56,6 @@ const closeForm = () => {
|
|||
<p>{{ subtitle }}</p>
|
||||
<slot name="form-inputs" />
|
||||
<div class="q-mt-lg row justify-end">
|
||||
<QBtn
|
||||
v-if="defaultSubmitButton"
|
||||
:label="customSubmitButtonLabel || t('globals.save')"
|
||||
type="submit"
|
||||
color="primary"
|
||||
:disabled="isLoading"
|
||||
:loading="isLoading"
|
||||
/>
|
||||
<QBtn
|
||||
v-if="defaultCancelButton"
|
||||
:label="t('globals.cancel')"
|
||||
|
|
@ -74,6 +66,14 @@ const closeForm = () => {
|
|||
:loading="isLoading"
|
||||
v-close-popup
|
||||
/>
|
||||
<QBtn
|
||||
v-if="defaultSubmitButton"
|
||||
:label="customSubmitButtonLabel || t('globals.save')"
|
||||
type="submit"
|
||||
color="primary"
|
||||
:disabled="isLoading"
|
||||
:loading="isLoading"
|
||||
/>
|
||||
<slot name="customButtons" />
|
||||
</div>
|
||||
</QCard>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,78 @@
|
|||
<script setup>
|
||||
import { onBeforeMount, computed } from 'vue';
|
||||
import { useRoute, onBeforeRouteUpdate } from 'vue-router';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { useArrayData } from 'src/composables/useArrayData';
|
||||
import { useStateStore } from 'stores/useStateStore';
|
||||
import useCardSize from 'src/composables/useCardSize';
|
||||
import VnSubToolbar from '../ui/VnSubToolbar.vue';
|
||||
import VnSearchbar from 'components/ui/VnSearchbar.vue';
|
||||
import LeftMenu from 'components/LeftMenu.vue';
|
||||
|
||||
const props = defineProps({
|
||||
dataKey: { type: String, required: true },
|
||||
baseUrl: { type: String, default: undefined },
|
||||
customUrl: { type: String, default: undefined },
|
||||
filter: { type: Object, default: () => {} },
|
||||
descriptor: { type: Object, required: true },
|
||||
searchbarDataKey: { type: String, default: undefined },
|
||||
searchbarUrl: { type: String, default: undefined },
|
||||
searchbarLabel: { type: String, default: '' },
|
||||
searchbarInfo: { type: String, default: '' },
|
||||
});
|
||||
|
||||
const { t } = useI18n();
|
||||
const stateStore = useStateStore();
|
||||
const route = useRoute();
|
||||
const url = computed(() => {
|
||||
if (props.baseUrl) return `${props.baseUrl}/${route.params.id}`;
|
||||
return props.customUrl;
|
||||
});
|
||||
|
||||
const arrayData = useArrayData(props.dataKey, {
|
||||
url: url.value,
|
||||
filter: props.filter,
|
||||
});
|
||||
|
||||
onBeforeMount(async () => {
|
||||
if (!props.baseUrl) arrayData.store.filter.where = { id: route.params.id };
|
||||
await arrayData.fetch({ append: false });
|
||||
});
|
||||
|
||||
if (props.baseUrl) {
|
||||
onBeforeRouteUpdate(async (to, from) => {
|
||||
if (to.params.id !== from.params.id) {
|
||||
arrayData.store.url = `${props.baseUrl}/${route.params.id}`;
|
||||
await arrayData.fetch({ append: false });
|
||||
}
|
||||
});
|
||||
}
|
||||
</script>
|
||||
<template>
|
||||
<Teleport
|
||||
to="#searchbar"
|
||||
v-if="stateStore.isHeaderMounted() && props.searchbarDataKey"
|
||||
>
|
||||
<VnSearchbar
|
||||
:data-key="props.searchbarDataKey"
|
||||
:url="props.searchbarUrl"
|
||||
:label="t(props.searchbarLabel)"
|
||||
:info="t(props.searchbarInfo)"
|
||||
/>
|
||||
</Teleport>
|
||||
<QDrawer v-model="stateStore.leftDrawer" show-if-above :width="256">
|
||||
<QScrollArea class="fit">
|
||||
<component :is="descriptor" />
|
||||
<QSeparator />
|
||||
<LeftMenu source="card" />
|
||||
</QScrollArea>
|
||||
</QDrawer>
|
||||
<QPageContainer>
|
||||
<QPage>
|
||||
<VnSubToolbar />
|
||||
<div :class="[useCardSize(), $attrs.class]">
|
||||
<RouterView />
|
||||
</div>
|
||||
</QPage>
|
||||
</QPageContainer>
|
||||
</template>
|
||||
|
|
@ -187,7 +187,7 @@ const columns = computed(() => [
|
|||
downloadFile(
|
||||
prop.row.id,
|
||||
$props.downloadModel,
|
||||
null,
|
||||
undefined,
|
||||
prop.row.download
|
||||
),
|
||||
},
|
||||
|
|
|
|||
|
|
@ -200,8 +200,8 @@ es:
|
|||
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 }'
|
||||
{ orderId } con llegada { landing } para recibirlo sin portes adicionales.'
|
||||
orderChanges: 'Pedido {orderId} con llegada estimada día { landing }: { changes }'
|
||||
en: Inglés
|
||||
es: Español
|
||||
fr: Francés
|
||||
|
|
@ -215,11 +215,12 @@ fr:
|
|||
Message: Message
|
||||
messageTooltip: Les caractères spéciaux comme les accents comptent comme plusieurs
|
||||
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 }'
|
||||
pendingPayment: 'Verdnatura : Commande en attente de règlement. Veuillez régler votre commande avant 9h.
|
||||
Sinon elle sera décalée en fonction de vos jours de livraison . Merci'
|
||||
minAmount: 'Verdnatura vous rappelle :
|
||||
Montant minimum nécessaire de 50 euros pour recevoir la commande { orderId } livraison { landing }.
|
||||
Merci.'
|
||||
orderChanges: 'Commande {orderId} livraison {landing} indisponible/s. Désolés pour le dérangement.'
|
||||
en: Anglais
|
||||
es: Espagnol
|
||||
fr: Français
|
||||
|
|
@ -236,8 +237,8 @@ pt:
|
|||
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 }'
|
||||
{ orderId } do dia { landing } para recebê-lo sem custos de envio adicionais.'
|
||||
orderChanges: 'Pedido { orderId } com chegada dia { landing }: { changes }'
|
||||
en: Inglês
|
||||
es: Espanhol
|
||||
fr: Francês
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<script setup>
|
||||
import { onBeforeMount, useSlots, watch, computed, ref } from 'vue';
|
||||
import { onBeforeMount, watch, computed, ref } from 'vue';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import SkeletonDescriptor from 'components/ui/SkeletonDescriptor.vue';
|
||||
import { useArrayData } from 'composables/useArrayData';
|
||||
|
|
@ -38,7 +38,6 @@ const $props = defineProps({
|
|||
});
|
||||
|
||||
const state = useState();
|
||||
const slots = useSlots();
|
||||
const { t } = useI18n();
|
||||
const { viewSummary } = useSummaryDialog();
|
||||
const arrayData = useArrayData($props.dataKey || $props.module, {
|
||||
|
|
@ -47,7 +46,7 @@ const arrayData = useArrayData($props.dataKey || $props.module, {
|
|||
skip: 0,
|
||||
});
|
||||
const { store } = arrayData;
|
||||
const entity = computed(() =>Array.isArray( store.data) ? store.data[0] : store.data);
|
||||
const entity = computed(() => (Array.isArray(store.data) ? store.data[0] : store.data));
|
||||
const isLoading = ref(false);
|
||||
|
||||
defineExpose({
|
||||
|
|
@ -55,14 +54,12 @@ defineExpose({
|
|||
});
|
||||
onBeforeMount(async () => {
|
||||
await getData();
|
||||
watch(
|
||||
() => $props.url,
|
||||
async () => await getData()
|
||||
);
|
||||
watch($props, async () => await getData());
|
||||
});
|
||||
|
||||
async function getData() {
|
||||
store.url = $props.url;
|
||||
store.filter = $props.filter ?? {};
|
||||
isLoading.value = true;
|
||||
try {
|
||||
const { data } = await arrayData.fetch({ append: false, updateRouter: false });
|
||||
|
|
@ -117,7 +114,7 @@ const emit = defineEmits(['onFetch']);
|
|||
icon="more_vert"
|
||||
round
|
||||
size="md"
|
||||
:class="{ invisible: !slots.menu }"
|
||||
:class="{ invisible: !$slots.menu }"
|
||||
>
|
||||
<QTooltip>
|
||||
{{ t('components.cardDescriptor.moreOptions') }}
|
||||
|
|
|
|||
|
|
@ -15,7 +15,7 @@ const props = defineProps({
|
|||
default: null,
|
||||
},
|
||||
entityId: {
|
||||
type: Number,
|
||||
type: [Number, String],
|
||||
default: null,
|
||||
},
|
||||
dataKey: {
|
||||
|
|
@ -32,7 +32,7 @@ const arrayData = useArrayData(props.dataKey || route.meta.moduleName, {
|
|||
skip: 0,
|
||||
});
|
||||
const { store } = arrayData;
|
||||
const entity = computed(() => Array.isArray(store.data) ? store.data[0] : store.data);
|
||||
const entity = computed(() => (Array.isArray(store.data) ? store.data[0] : store.data));
|
||||
const isLoading = ref(false);
|
||||
|
||||
defineExpose({
|
||||
|
|
@ -48,9 +48,10 @@ onBeforeMount(async () => {
|
|||
|
||||
async function fetch() {
|
||||
store.url = props.url;
|
||||
store.filter = props.filter ?? {};
|
||||
isLoading.value = true;
|
||||
const { data } = await arrayData.fetch({ append: false, updateRouter: false });
|
||||
emit('onFetch', data);
|
||||
emit('onFetch', Array.isArray(data) ? data[0] : data);
|
||||
isLoading.value = false;
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -12,12 +12,23 @@ const $props = defineProps({
|
|||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
viewCustomization: {
|
||||
type: String,
|
||||
default: '',
|
||||
},
|
||||
});
|
||||
|
||||
const $q = useQuasar();
|
||||
|
||||
// El objetivo de asignar las clases de personalización desde el wrapper es no tener conflictos entre vistas que usen el mismo componente
|
||||
const viewCustomizationClasses = {
|
||||
workerCalendar: 'worker-calendar-customizations',
|
||||
};
|
||||
|
||||
const containerClasses = computed(() => {
|
||||
const classes = ['main-container-background'];
|
||||
if (viewCustomizationClasses[$props.viewCustomization])
|
||||
classes.push(viewCustomizationClasses[$props.viewCustomization]);
|
||||
if ($props.bordered) classes.push('--bordered');
|
||||
if ($props.transparentBackground) classes.push('transparent-background');
|
||||
else classes.push($q.dark.isActive ? '--dark' : '--light');
|
||||
|
|
@ -33,6 +44,47 @@ const containerClasses = computed(() => {
|
|||
</template>
|
||||
|
||||
<style lang="scss">
|
||||
@import '../../css/quasar.variables.scss';
|
||||
|
||||
:root {
|
||||
// Cambia los colores del día actual del calendario por los de salix
|
||||
--calendar-border-current-dark: #84d0e2 2px solid;
|
||||
--calendar-border-current: #84d0e2 2px solid;
|
||||
--calendar-current-color-dark: #84d0e2;
|
||||
// Colores de fondo del calendario en dark mode
|
||||
--calendar-outside-background-dark: #222;
|
||||
--calendar-background-dark: #222;
|
||||
}
|
||||
|
||||
// Clases para modificar el color de fecha seleccionada en componente QCalendarMonth
|
||||
.q-dark div .q-calendar-mini .q-calendar-month__day.q-selected .q-calendar__button {
|
||||
background-color: $primary !important;
|
||||
color: white !important;
|
||||
}
|
||||
|
||||
.q-calendar-mini .q-calendar-month__day.q-selected .q-calendar__button {
|
||||
background-color: $primary !important;
|
||||
color: white !important;
|
||||
}
|
||||
|
||||
.q-calendar-month__head--weekday {
|
||||
// Transforma los nombres de los días de la semana a mayúsculas
|
||||
text-transform: capitalize;
|
||||
}
|
||||
|
||||
.transparent-background {
|
||||
--calendar-background-dark: transparent;
|
||||
--calendar-background: transparent;
|
||||
--calendar-outside-background-dark: transparent;
|
||||
}
|
||||
|
||||
.q-calendar__button {
|
||||
&:hover {
|
||||
background-color: var(--vn-accent-color);
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.main-container-background {
|
||||
--calendar-current-background-dark: transparent;
|
||||
|
||||
|
|
@ -45,14 +97,64 @@ const containerClasses = computed(() => {
|
|||
}
|
||||
|
||||
&.--bordered {
|
||||
border: 1px solid black;
|
||||
border: 1px solid #222;
|
||||
}
|
||||
}
|
||||
|
||||
.transparent-background {
|
||||
--calendar-background-dark: transparent;
|
||||
--calendar-background: transparent;
|
||||
--calendar-outside-background-dark: transparent;
|
||||
.worker-calendar-customizations {
|
||||
.q-calendar__button {
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
font-size: 13px;
|
||||
|
||||
&:hover {
|
||||
background-color: var(--vn-accent-color);
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.q-calendar-month__week--days > div:nth-child(6),
|
||||
.q-calendar-month__week--days > div:nth-child(7) {
|
||||
// Cambia el color de los días sábado y domingo
|
||||
color: #777777;
|
||||
}
|
||||
|
||||
.q-calendar-month__week--wrapper {
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
|
||||
.q-calendar-month__workweek {
|
||||
height: 32px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.q-calendar__button--bordered {
|
||||
color: $info !important;
|
||||
}
|
||||
|
||||
.q-calendar-month__day--content {
|
||||
position: absolute;
|
||||
top: 1;
|
||||
left: 0;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.q-outside .calendar-event {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.q-calendar-month__workweek,
|
||||
.q-calendar-month__head--workweek,
|
||||
.q-calendar-month__head--weekday.q-calendar__center.q-calendar__ellipsis {
|
||||
text-transform: capitalize;
|
||||
color: #777;
|
||||
font-weight: bold;
|
||||
font-size: 0.8rem;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
.nav-container {
|
||||
|
|
|
|||
|
|
@ -32,7 +32,7 @@ async function insert() {
|
|||
<template>
|
||||
<QCard class="q-pa-xs q-mb-xl full-width" v-if="$props.addNote">
|
||||
<QCardSection horizontal>
|
||||
<VnAvatar :descriptor="false" :worker-id="1" size="md" />
|
||||
<VnAvatar :worker-id="currentUser.id" size="md" />
|
||||
<div class="full-width row justify-between q-pa-xs">
|
||||
<VnUserLink :name="t('New note')" :worker-id="currentUser.id" />
|
||||
{{ t('globals.now') }}
|
||||
|
|
@ -78,8 +78,8 @@ async function insert() {
|
|||
<TransitionGroup name="list" tag="div" class="column items-center full-width">
|
||||
<QCard
|
||||
class="q-pa-xs q-mb-sm full-width"
|
||||
v-for="note in rows"
|
||||
:key="note.id"
|
||||
v-for="(note, index) in rows"
|
||||
:key="note.id ?? index"
|
||||
>
|
||||
<QCardSection horizontal>
|
||||
<VnAvatar
|
||||
|
|
|
|||
|
|
@ -77,7 +77,6 @@ const arrayData = useArrayData(props.dataKey, {
|
|||
userParams: props.userParams,
|
||||
exprBuilder: props.exprBuilder,
|
||||
});
|
||||
const hasMoreData = ref();
|
||||
const store = arrayData.store;
|
||||
|
||||
onMounted(() => {
|
||||
|
|
@ -97,7 +96,7 @@ const addFilter = async (filter, params) => {
|
|||
|
||||
async function fetch() {
|
||||
await arrayData.fetch({ append: false });
|
||||
if (!arrayData.hasMoreData.value) {
|
||||
if (!store.hasMoreData) {
|
||||
isLoading.value = false;
|
||||
}
|
||||
emit('onFetch', store.data);
|
||||
|
|
@ -110,8 +109,8 @@ async function paginate() {
|
|||
|
||||
isLoading.value = true;
|
||||
await arrayData.loadMore();
|
||||
if (!arrayData.hasMoreData.value) {
|
||||
if (store.userParamsChanged) arrayData.hasMoreData.value = true;
|
||||
if (!store.hasMoreData) {
|
||||
if (store.userParamsChanged) store.hasMoreData = true;
|
||||
store.userParamsChanged = false;
|
||||
endPagination();
|
||||
return;
|
||||
|
|
@ -132,9 +131,7 @@ function endPagination() {
|
|||
emit('onPaginate');
|
||||
}
|
||||
async function onLoad(index, done) {
|
||||
if (!store.data) {
|
||||
return done();
|
||||
}
|
||||
if (!store.data) return done();
|
||||
|
||||
if (store.data.length === 0 || !props.url) return done(false);
|
||||
|
||||
|
|
@ -142,7 +139,7 @@ async function onLoad(index, done) {
|
|||
|
||||
await paginate();
|
||||
let isDone = false;
|
||||
if (store.userParamsChanged) isDone = !arrayData.hasMoreData.value;
|
||||
if (store.userParamsChanged) isDone = !store.hasMoreData;
|
||||
done(isDone);
|
||||
}
|
||||
|
||||
|
|
@ -182,13 +179,12 @@ defineExpose({ fetch, addFilter });
|
|||
</QCard>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<QInfiniteScroll
|
||||
v-if="store.data"
|
||||
@load="onLoad"
|
||||
:offset="offset"
|
||||
:disable="disableInfiniteScroll || !arrayData.hasMoreData"
|
||||
class="full-width"
|
||||
:disable="disableInfiniteScroll || !store.hasMoreData"
|
||||
v-bind="$attrs"
|
||||
>
|
||||
<slot name="body" :rows="store.data"></slot>
|
||||
|
|
@ -196,7 +192,10 @@ defineExpose({ fetch, addFilter });
|
|||
<QSpinner color="orange" size="md" />
|
||||
</div>
|
||||
</QInfiniteScroll>
|
||||
<div v-if="!isLoading && hasMoreData" class="w-full flex justify-center q-mt-md">
|
||||
<div
|
||||
v-if="!isLoading && store.hasMoreData"
|
||||
class="w-full flex justify-center q-mt-md"
|
||||
>
|
||||
<QBtn color="primary" :label="t('Load more data')" @click="paginate()" />
|
||||
</div>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -131,13 +131,6 @@ async function search() {
|
|||
/>
|
||||
</template>
|
||||
<template #append>
|
||||
<QIcon
|
||||
v-if="searchText !== ''"
|
||||
name="close"
|
||||
@click="searchText = ''"
|
||||
class="cursor-pointer"
|
||||
/>
|
||||
|
||||
<QIcon
|
||||
v-if="props.info && $q.screen.gt.xs"
|
||||
name="info"
|
||||
|
|
|
|||
|
|
@ -1,11 +1,27 @@
|
|||
<script setup>
|
||||
import { onMounted, onUnmounted } from 'vue';
|
||||
import { onMounted, onUnmounted, ref } from 'vue';
|
||||
import { useStateStore } from 'stores/useStateStore';
|
||||
|
||||
const stateStore = useStateStore();
|
||||
const actions = ref(null);
|
||||
const data = ref(null);
|
||||
const opts = { subtree: true, childList: true, attributes: true };
|
||||
const hasContent = ref(false);
|
||||
|
||||
onMounted(() => {
|
||||
stateStore.toggleSubToolbar();
|
||||
actions.value = document.querySelector('#st-actions');
|
||||
data.value = document.querySelector('#st-data');
|
||||
|
||||
if (!actions.value && !data.value) return;
|
||||
|
||||
// Check if there's content to display
|
||||
const observer = new MutationObserver(
|
||||
() =>
|
||||
(hasContent.value =
|
||||
actions.value.childNodes.length + data.value.childNodes.length)
|
||||
);
|
||||
if (actions.value) observer.observe(actions.value, opts);
|
||||
if (data.value) observer.observe(data.value, opts);
|
||||
});
|
||||
|
||||
onUnmounted(() => {
|
||||
|
|
@ -14,7 +30,10 @@ onUnmounted(() => {
|
|||
</script>
|
||||
|
||||
<template>
|
||||
<QToolbar class="bg-vn-section-color justify-end sticky">
|
||||
<QToolbar
|
||||
class="justify-end sticky"
|
||||
v-show="hasContent || $slots['st-actions'] || $slots['st-data']"
|
||||
>
|
||||
<slot name="st-data">
|
||||
<div id="st-data"></div>
|
||||
</slot>
|
||||
|
|
|
|||
|
|
@ -9,12 +9,9 @@ const arrayDataStore = useArrayDataStore();
|
|||
export function useArrayData(key, userOptions) {
|
||||
if (!key) throw new Error('ArrayData: A key is required to use this composable');
|
||||
|
||||
if (!arrayDataStore.get(key)) {
|
||||
arrayDataStore.set(key);
|
||||
}
|
||||
if (!arrayDataStore.get(key)) arrayDataStore.set(key);
|
||||
|
||||
const store = arrayDataStore.get(key);
|
||||
const hasMoreData = ref(false);
|
||||
const route = useRoute();
|
||||
let canceller = null;
|
||||
|
||||
|
|
@ -22,6 +19,7 @@ export function useArrayData(key, userOptions) {
|
|||
|
||||
onMounted(() => {
|
||||
setOptions();
|
||||
store.skip = 0;
|
||||
|
||||
const query = route.query;
|
||||
if (query.params) {
|
||||
|
|
@ -29,9 +27,7 @@ export function useArrayData(key, userOptions) {
|
|||
}
|
||||
});
|
||||
|
||||
if (key && userOptions) {
|
||||
setOptions();
|
||||
}
|
||||
if (key && userOptions) setOptions();
|
||||
|
||||
function setOptions() {
|
||||
const allowedOptions = [
|
||||
|
|
@ -96,8 +92,7 @@ export function useArrayData(key, userOptions) {
|
|||
});
|
||||
|
||||
const { limit } = filter;
|
||||
hasMoreData.value = limit && response.data.length >= limit;
|
||||
store.hasMoreData = hasMoreData.value;
|
||||
store.hasMoreData = limit && response.data.length >= limit;
|
||||
|
||||
if (append) {
|
||||
if (!store.data) store.data = [];
|
||||
|
|
@ -169,7 +164,7 @@ export function useArrayData(key, userOptions) {
|
|||
}
|
||||
|
||||
async function loadMore() {
|
||||
if (!hasMoreData.value && !store.hasMoreData) return;
|
||||
if (!store.hasMoreData) return;
|
||||
|
||||
store.skip = store.limit * page.value;
|
||||
page.value += 1;
|
||||
|
|
@ -211,7 +206,6 @@ export function useArrayData(key, userOptions) {
|
|||
destroy,
|
||||
loadMore,
|
||||
store,
|
||||
hasMoreData,
|
||||
totalRows,
|
||||
updateStateParams,
|
||||
isLoading,
|
||||
|
|
|
|||
|
|
@ -196,3 +196,7 @@ input::-webkit-inner-spin-button {
|
|||
background-color: $primary !important;
|
||||
color: white !important;
|
||||
}
|
||||
|
||||
.q-scrollarea__content {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -91,3 +91,24 @@ export function toDateTimeFormat(date, showSeconds = false) {
|
|||
second: showSeconds ? '2-digit' : undefined,
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Converts seconds to a formatted string representing hours and minutes (hh:mm).
|
||||
* @param {number} seconds - The number of seconds to convert.
|
||||
* @param {boolean} includeHSuffix - Optional parameter indicating whether to include "h." after the hour.
|
||||
* @returns {string} A string representing the time in the format "hh:mm" with optional "h." suffix.
|
||||
*/
|
||||
export function secondsToHoursMinutes(seconds, includeHSuffix = true) {
|
||||
if (!seconds) return includeHSuffix ? '00:00 h.' : '00:00';
|
||||
|
||||
const hours = Math.floor(seconds / 3600);
|
||||
const remainingMinutes = seconds % 3600;
|
||||
const minutes = Math.floor(remainingMinutes / 60);
|
||||
const formattedHours = hours < 10 ? '0' + hours : hours;
|
||||
const formattedMinutes = minutes < 10 ? '0' + minutes : minutes;
|
||||
|
||||
// Append "h." if includeHSuffix is true
|
||||
const suffix = includeHSuffix ? ' h.' : '';
|
||||
// Return formatted string
|
||||
return formattedHours + ':' + formattedMinutes + suffix;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -83,6 +83,7 @@ globals:
|
|||
selectFile: Select a file
|
||||
copyClipboard: Copy on clipboard
|
||||
salesPerson: SalesPerson
|
||||
send: Send
|
||||
code: Code
|
||||
pageTitles:
|
||||
summary: Summary
|
||||
|
|
@ -811,6 +812,7 @@ worker:
|
|||
pbx: Private Branch Exchange
|
||||
log: Log
|
||||
calendar: Calendar
|
||||
timeControl: Time control
|
||||
list:
|
||||
name: Name
|
||||
email: Email
|
||||
|
|
|
|||
|
|
@ -83,6 +83,7 @@ globals:
|
|||
selectFile: Seleccione un fichero
|
||||
copyClipboard: Copiar en portapapeles
|
||||
salesPerson: Comercial
|
||||
send: Enviar
|
||||
code: Código
|
||||
pageTitles:
|
||||
summary: Resumen
|
||||
|
|
@ -809,6 +810,7 @@ worker:
|
|||
pbx: Centralita
|
||||
log: Historial
|
||||
calendar: Calendario
|
||||
timeControl: Control de horario
|
||||
list:
|
||||
name: Nombre
|
||||
email: Email
|
||||
|
|
|
|||
|
|
@ -1,46 +1,15 @@
|
|||
<script setup>
|
||||
import LeftMenu from 'components/LeftMenu.vue';
|
||||
import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
|
||||
import { useStateStore } from 'stores/useStateStore';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import VnCard from 'components/common/VnCard.vue';
|
||||
import ClaimDescriptor from './ClaimDescriptor.vue';
|
||||
import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
|
||||
import useCardSize from 'src/composables/useCardSize';
|
||||
|
||||
const stateStore = useStateStore();
|
||||
const { t } = useI18n();
|
||||
</script>
|
||||
<template>
|
||||
<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')"
|
||||
/>
|
||||
</Teleport>
|
||||
<QDrawer v-model="stateStore.leftDrawer" show-if-above :width="256">
|
||||
<QScrollArea class="fit">
|
||||
<ClaimDescriptor />
|
||||
<QSeparator />
|
||||
<LeftMenu source="card" />
|
||||
</QScrollArea>
|
||||
</QDrawer>
|
||||
<QPageContainer>
|
||||
<QPage>
|
||||
<VnSubToolbar />
|
||||
<div :class="useCardSize()">
|
||||
<RouterView></RouterView>
|
||||
</div>
|
||||
</QPage>
|
||||
</QPageContainer>
|
||||
<VnCard
|
||||
data-key="Claim"
|
||||
base-url="Claims"
|
||||
:descriptor="ClaimDescriptor"
|
||||
searchbar-data-key="ClaimList"
|
||||
searchbar-url="Claims/filter"
|
||||
searchbar-label="Search claim"
|
||||
searchbar-info="You can search by claim id or customer name"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<i18n>
|
||||
es:
|
||||
Search claim: Buscar reclamación
|
||||
You can search by claim id or customer name: Puedes buscar por id de la reclamación o nombre del cliente
|
||||
Details: Detalles
|
||||
Notes: Notas
|
||||
Action: Acción
|
||||
</i18n>
|
||||
|
|
|
|||
|
|
@ -16,7 +16,7 @@ const claimId = computed(() => $props.id || route.params.id);
|
|||
|
||||
const claimFilter = {
|
||||
where: { claimFk: claimId.value },
|
||||
fields: ['created', 'workerFk', 'text'],
|
||||
fields: ['id', 'created', 'workerFk', 'text'],
|
||||
include: {
|
||||
relation: 'worker',
|
||||
scope: {
|
||||
|
|
|
|||
|
|
@ -0,0 +1,2 @@
|
|||
Search claim: Buscar reclamación
|
||||
You can search by claim id or customer name: Puedes buscar por id de la reclamación o nombre del cliente
|
||||
|
|
@ -1,43 +1,15 @@
|
|||
<script setup>
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { useStateStore } from 'stores/useStateStore';
|
||||
import VnCard from 'components/common/VnCard.vue';
|
||||
import CustomerDescriptor from './CustomerDescriptor.vue';
|
||||
import LeftMenu from 'components/LeftMenu.vue';
|
||||
import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
|
||||
import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
|
||||
import useCardSize from 'src/composables/useCardSize';
|
||||
|
||||
const stateStore = useStateStore();
|
||||
const { t } = useI18n();
|
||||
</script>
|
||||
<template>
|
||||
<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')"
|
||||
/>
|
||||
</Teleport>
|
||||
<QDrawer v-model="stateStore.leftDrawer" show-if-above :width="256">
|
||||
<QScrollArea class="fit">
|
||||
<CustomerDescriptor />
|
||||
<QSeparator />
|
||||
<LeftMenu source="card" />
|
||||
</QScrollArea>
|
||||
</QDrawer>
|
||||
<QPageContainer>
|
||||
<QPage>
|
||||
<VnSubToolbar />
|
||||
<div :class="useCardSize()">
|
||||
<RouterView></RouterView>
|
||||
</div>
|
||||
</QPage>
|
||||
</QPageContainer>
|
||||
<VnCard
|
||||
data-key="Client"
|
||||
base-url="Clients"
|
||||
:descriptor="CustomerDescriptor"
|
||||
searchbar-data-key="CustomerList"
|
||||
searchbar-url="Clients/filter"
|
||||
searchbar-label="Search customer"
|
||||
searchbar-info="You can search by customer id or name"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<i18n>
|
||||
es:
|
||||
Search customer: Buscar cliente
|
||||
You can search by customer id or name: Puedes buscar por id o nombre del cliente
|
||||
</i18n>
|
||||
|
|
|
|||
|
|
@ -1,3 +1,5 @@
|
|||
Search customer: Buscar cliente
|
||||
You can search by customer id or name: Puedes buscar por id o nombre del cliente
|
||||
customerFilter:
|
||||
filter:
|
||||
name: Nombre
|
||||
|
|
|
|||
|
|
@ -1,26 +1,13 @@
|
|||
<script setup>
|
||||
import { useStateStore } from 'stores/useStateStore';
|
||||
import VnCard from 'components/common/VnCard.vue';
|
||||
import DepartmentDescriptor from 'pages/Department/Card/DepartmentDescriptor.vue';
|
||||
import LeftMenu from 'components/LeftMenu.vue';
|
||||
import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
|
||||
|
||||
const stateStore = useStateStore();
|
||||
</script>
|
||||
<template>
|
||||
<QDrawer v-model="stateStore.leftDrawer" show-if-above :width="256">
|
||||
<QScrollArea class="fit">
|
||||
<DepartmentDescriptor />
|
||||
<QSeparator />
|
||||
<LeftMenu source="card" />
|
||||
</QScrollArea>
|
||||
</QDrawer>
|
||||
<QPageContainer>
|
||||
<QPage>
|
||||
<VnSubToolbar />
|
||||
|
||||
<div class="q-pa-md column items-center">
|
||||
<RouterView></RouterView>
|
||||
</div>
|
||||
</QPage>
|
||||
</QPageContainer>
|
||||
<VnCard
|
||||
class="q-pa-md column items-center"
|
||||
v-bind="{ ...$attrs }"
|
||||
data-key="Department"
|
||||
base-url="Departments"
|
||||
:descriptor="DepartmentDescriptor"
|
||||
/>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -27,6 +27,7 @@ onMounted(async () => {
|
|||
|
||||
<template>
|
||||
<CardSummary
|
||||
data-key="DepartmentSummary"
|
||||
ref="summary"
|
||||
:url="`Departments/${entityId}`"
|
||||
class="full-width"
|
||||
|
|
|
|||
|
|
@ -1,48 +1,15 @@
|
|||
<script setup>
|
||||
import { useI18n } from 'vue-i18n';
|
||||
|
||||
import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
|
||||
import LeftMenu from 'components/LeftMenu.vue';
|
||||
import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
|
||||
import VnCard from 'components/common/VnCard.vue';
|
||||
import EntryDescriptor from './EntryDescriptor.vue';
|
||||
|
||||
import { useStateStore } from 'stores/useStateStore';
|
||||
import useCardSize from 'src/composables/useCardSize';
|
||||
|
||||
const { t } = useI18n();
|
||||
const stateStore = useStateStore();
|
||||
</script>
|
||||
<template>
|
||||
<template v-if="stateStore.isHeaderMounted()">
|
||||
<Teleport to="#searchbar">
|
||||
<VnSearchbar
|
||||
data-key="EntryList"
|
||||
url="Entries/filter"
|
||||
:label="t('Search entries')"
|
||||
:info="t('You can search by entry reference')"
|
||||
/>
|
||||
</Teleport>
|
||||
</template>
|
||||
<QDrawer v-model="stateStore.leftDrawer" show-if-above :width="256">
|
||||
<QScrollArea class="fit">
|
||||
<EntryDescriptor />
|
||||
<QSeparator />
|
||||
<LeftMenu source="card" />
|
||||
</QScrollArea>
|
||||
</QDrawer>
|
||||
<QPageContainer>
|
||||
<QPage>
|
||||
<VnSubToolbar />
|
||||
|
||||
<div :class="useCardSize()">
|
||||
<RouterView></RouterView>
|
||||
</div>
|
||||
</QPage>
|
||||
</QPageContainer>
|
||||
<VnCard
|
||||
data-key="Entry"
|
||||
base-url="Entries"
|
||||
:descriptor="EntryDescriptor"
|
||||
searchbar-data-key="EntryList"
|
||||
searchbar-url="Entries/filter"
|
||||
searchbar-label="Search entries"
|
||||
searchbar-info="You can search by entry reference"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<i18n>
|
||||
es:
|
||||
Search entries: Buscar entradas
|
||||
You can search by entry reference: Puedes buscar por referencia de la entrada
|
||||
</i18n>
|
||||
|
|
|
|||
|
|
@ -1,3 +1,5 @@
|
|||
Search entries: Buscar entradas
|
||||
You can search by entry reference: Puedes buscar por referencia de la entrada
|
||||
entryList:
|
||||
list:
|
||||
inventoryEntry: Es inventario
|
||||
|
|
|
|||
|
|
@ -1,18 +1,6 @@
|
|||
<script setup>
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { useStateStore } from 'stores/useStateStore';
|
||||
import VnCard from 'components/common/VnCard.vue';
|
||||
import InvoiceInDescriptor from './InvoiceInDescriptor.vue';
|
||||
import LeftMenu from 'components/LeftMenu.vue';
|
||||
import VnSearchbar from 'components/ui/VnSearchbar.vue';
|
||||
import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
|
||||
import { useArrayData } from 'src/composables/useArrayData';
|
||||
import { onMounted, watch } from 'vue';
|
||||
import { useRoute } from 'vue-router';
|
||||
import useCardSize from 'src/composables/useCardSize';
|
||||
|
||||
const stateStore = useStateStore();
|
||||
const { t } = useI18n();
|
||||
const route = useRoute();
|
||||
|
||||
const filter = {
|
||||
include: [
|
||||
|
|
@ -21,69 +9,25 @@ const filter = {
|
|||
scope: {
|
||||
include: {
|
||||
relation: 'contacts',
|
||||
scope: {
|
||||
where: {
|
||||
email: { neq: null },
|
||||
},
|
||||
},
|
||||
scope: { where: { email: { neq: null } } },
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
relation: 'invoiceInDueDay',
|
||||
},
|
||||
{
|
||||
relation: 'company',
|
||||
},
|
||||
{
|
||||
relation: 'currency',
|
||||
},
|
||||
{ relation: 'invoiceInDueDay' },
|
||||
{ relation: 'company' },
|
||||
{ relation: 'currency' },
|
||||
],
|
||||
};
|
||||
const arrayData = useArrayData('InvoiceIn', {
|
||||
url: `InvoiceIns/${route.params.id}`,
|
||||
filter,
|
||||
});
|
||||
|
||||
onMounted(async () => await arrayData.fetch({ append: false }));
|
||||
watch(
|
||||
() => route.params.id,
|
||||
async (newId, oldId) => {
|
||||
if (newId) {
|
||||
arrayData.store.url = `InvoiceIns/${newId}`;
|
||||
await arrayData.fetch({ append: false });
|
||||
}
|
||||
}
|
||||
);
|
||||
</script>
|
||||
<template>
|
||||
<Teleport to="#searchbar" v-if="stateStore.isHeaderMounted()">
|
||||
<VnSearchbar
|
||||
data-key="InvoiceInList"
|
||||
url="InvoiceIns/filter"
|
||||
:label="t('Search invoice')"
|
||||
:info="t('You can search by invoice reference')"
|
||||
/>
|
||||
</Teleport>
|
||||
<QDrawer v-model="stateStore.leftDrawer" show-if-above :width="256">
|
||||
<QScrollArea class="fit">
|
||||
<InvoiceInDescriptor />
|
||||
<QSeparator />
|
||||
<LeftMenu source="card" />
|
||||
</QScrollArea>
|
||||
</QDrawer>
|
||||
<QPageContainer>
|
||||
<QPage>
|
||||
<VnSubToolbar />
|
||||
<div :class="useCardSize()">
|
||||
<RouterView></RouterView>
|
||||
</div>
|
||||
</QPage>
|
||||
</QPageContainer>
|
||||
<VnCard
|
||||
data-key="InvoiceIn"
|
||||
base-url="InvoiceIns"
|
||||
:filter="filter"
|
||||
:descriptor="InvoiceInDescriptor"
|
||||
searchbar-data-key="InvoiceInList"
|
||||
searchbar-url="InvoiceIns/filter"
|
||||
searchbar-label="Search invoice"
|
||||
searchbar-info="You can search by invoice reference"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<i18n>
|
||||
es:
|
||||
Search invoice: Buscar factura recibida
|
||||
You can search by invoice reference: Puedes buscar por referencia de la factura
|
||||
</i18n>
|
||||
|
|
|
|||
|
|
@ -7,7 +7,6 @@ import VnFilterPanel from 'src/components/ui/VnFilterPanel.vue';
|
|||
import FetchData from 'components/FetchData.vue';
|
||||
import VnInput from 'src/components/common/VnInput.vue';
|
||||
import VnInputDate from 'components/common/VnInputDate.vue';
|
||||
import { useCapitalize } from 'src/composables/useCapitalize';
|
||||
import VnCurrency from 'src/components/common/VnCurrency.vue';
|
||||
|
||||
const { t } = useI18n();
|
||||
|
|
@ -70,19 +69,15 @@ const suppliersRef = ref();
|
|||
</QItemSection>
|
||||
</QItem>
|
||||
<QItem>
|
||||
<QItemSection>
|
||||
<VnInputDate
|
||||
:label="t('From')"
|
||||
v-model="params.from"
|
||||
is-outlined
|
||||
/>
|
||||
</QItemSection>
|
||||
</QItem>
|
||||
<QItem>
|
||||
<QItemSection>
|
||||
<VnInputDate :label="t('To')" v-model="params.to" is-outlined />
|
||||
</QItemSection>
|
||||
</QItem>
|
||||
<QItemSection>
|
||||
<VnInputDate :label="t('From')" v-model="params.from" is-outlined />
|
||||
</QItemSection>
|
||||
</QItem>
|
||||
<QItem>
|
||||
<QItemSection>
|
||||
<VnInputDate :label="t('To')" v-model="params.to" is-outlined />
|
||||
</QItemSection>
|
||||
</QItem>
|
||||
<QItem>
|
||||
<QItemSection>
|
||||
<VnInput
|
||||
|
|
@ -114,33 +109,33 @@ const suppliersRef = ref();
|
|||
</QItem>
|
||||
<QExpansionItem :label="t('More options')" expand-separator>
|
||||
<QItem>
|
||||
<QItemSection>
|
||||
<VnInput
|
||||
:label="t('params.fi')"
|
||||
v-model="params.fi"
|
||||
is-outlined
|
||||
lazy-rules
|
||||
>
|
||||
<template #prepend>
|
||||
<QIcon name="badge" size="sm"></QIcon>
|
||||
</template>
|
||||
</VnInput>
|
||||
</QItemSection>
|
||||
</QItem>
|
||||
<QItem>
|
||||
<QItemSection>
|
||||
<VnInput
|
||||
:label="t('params.serialNumber')"
|
||||
v-model="params.serialNumber"
|
||||
is-outlined
|
||||
lazy-rules
|
||||
>
|
||||
<template #prepend>
|
||||
<QIcon name="badge" size="sm"></QIcon>
|
||||
</template>
|
||||
</VnInput>
|
||||
</QItemSection>
|
||||
</QItem>
|
||||
<QItemSection>
|
||||
<VnInput
|
||||
:label="t('params.fi')"
|
||||
v-model="params.fi"
|
||||
is-outlined
|
||||
lazy-rules
|
||||
>
|
||||
<template #prepend>
|
||||
<QIcon name="badge" size="sm"></QIcon>
|
||||
</template>
|
||||
</VnInput>
|
||||
</QItemSection>
|
||||
</QItem>
|
||||
<QItem>
|
||||
<QItemSection>
|
||||
<VnInput
|
||||
:label="t('params.serialNumber')"
|
||||
v-model="params.serialNumber"
|
||||
is-outlined
|
||||
lazy-rules
|
||||
>
|
||||
<template #prepend>
|
||||
<QIcon name="badge" size="sm"></QIcon>
|
||||
</template>
|
||||
</VnInput>
|
||||
</QItemSection>
|
||||
</QItem>
|
||||
<QItem>
|
||||
<QItemSection>
|
||||
<VnInput
|
||||
|
|
|
|||
|
|
@ -0,0 +1,2 @@
|
|||
Search invoice: Buscar factura recibida
|
||||
You can search by invoice reference: Puedes buscar por referencia de la factura
|
||||
|
|
@ -1,43 +1,15 @@
|
|||
<script setup>
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { useStateStore } from 'stores/useStateStore';
|
||||
import InvoiceOutDescriptor from './InvoiceOutDescriptor.vue';
|
||||
import LeftMenu from 'components/LeftMenu.vue';
|
||||
import VnSearchbar from 'components/ui/VnSearchbar.vue';
|
||||
import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
|
||||
import useCardSize from 'src/composables/useCardSize';
|
||||
|
||||
const stateStore = useStateStore();
|
||||
const { t } = useI18n();
|
||||
import VnCard from 'components/common/VnCard.vue';
|
||||
</script>
|
||||
<template>
|
||||
<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')"
|
||||
/>
|
||||
</Teleport>
|
||||
<QDrawer v-model="stateStore.leftDrawer" show-if-above :width="256">
|
||||
<QScrollArea class="fit">
|
||||
<InvoiceOutDescriptor />
|
||||
<QSeparator />
|
||||
<LeftMenu source="card" />
|
||||
</QScrollArea>
|
||||
</QDrawer>
|
||||
<QPageContainer>
|
||||
<QPage>
|
||||
<VnSubToolbar />
|
||||
<div :class="useCardSize()">
|
||||
<RouterView></RouterView>
|
||||
</div>
|
||||
</QPage>
|
||||
</QPageContainer>
|
||||
<VnCard
|
||||
data-key="InvoiceOut"
|
||||
base-url="InvoiceOuts"
|
||||
:descriptor="InvoiceOutDescriptor"
|
||||
searchbar-data-key="InvoiceOutList"
|
||||
searchbar-url="InvoiceOuts/filter"
|
||||
searchbar-label="Search invoice"
|
||||
searchbar-info="You can search by invoice reference"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<i18n>
|
||||
es:
|
||||
Search invoice: Buscar factura emitida
|
||||
You can search by invoice reference: Puedes buscar por referencia de la factura
|
||||
</i18n>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,2 @@
|
|||
Search invoice: Buscar factura emitida
|
||||
You can search by invoice reference: Puedes buscar por referencia de la factura
|
||||
|
|
@ -1,28 +1,7 @@
|
|||
<script setup>
|
||||
import LeftMenu from 'components/LeftMenu.vue';
|
||||
import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
|
||||
import VnCard from 'components/common/VnCard.vue';
|
||||
import ItemDescriptor from './ItemDescriptor.vue';
|
||||
|
||||
import { useStateStore } from 'stores/useStateStore';
|
||||
import useCardSize from 'src/composables/useCardSize';
|
||||
|
||||
const stateStore = useStateStore();
|
||||
</script>
|
||||
<template>
|
||||
<QDrawer v-model="stateStore.leftDrawer" show-if-above :width="256">
|
||||
<QScrollArea class="fit">
|
||||
<ItemDescriptor />
|
||||
<QSeparator />
|
||||
<LeftMenu source="card" />
|
||||
</QScrollArea>
|
||||
</QDrawer>
|
||||
<QPageContainer>
|
||||
<QPage>
|
||||
<VnSubToolbar />
|
||||
|
||||
<div :class="useCardSize()">
|
||||
<RouterView></RouterView>
|
||||
</div>
|
||||
</QPage>
|
||||
</QPageContainer>
|
||||
<VnCard data-key="Item" base-url="Items" :descriptor="ItemDescriptor" />
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -1,23 +1,7 @@
|
|||
<script setup>
|
||||
import LeftMenu from 'components/LeftMenu.vue';
|
||||
import { useStateStore } from 'stores/useStateStore';
|
||||
import VnCard from 'components/common/VnCard.vue';
|
||||
import OrderDescriptor from 'pages/Order/Card/OrderDescriptor.vue';
|
||||
import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
|
||||
|
||||
const stateStore = useStateStore();
|
||||
</script>
|
||||
<template>
|
||||
<QDrawer v-model="stateStore.leftDrawer" show-if-above :width="256">
|
||||
<QScrollArea class="fit">
|
||||
<OrderDescriptor />
|
||||
<QSeparator />
|
||||
<LeftMenu source="card" />
|
||||
</QScrollArea>
|
||||
</QDrawer>
|
||||
<QPageContainer>
|
||||
<QPage>
|
||||
<VnSubToolbar />
|
||||
<RouterView></RouterView>
|
||||
</QPage>
|
||||
</QPageContainer>
|
||||
<VnCard data-key="Order" base-url="Orders" :descriptor="OrderDescriptor" />
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -4,7 +4,6 @@ import { useRoute } from 'vue-router';
|
|||
import { useI18n } from 'vue-i18n';
|
||||
import VnRow from 'components/ui/VnRow.vue';
|
||||
import FetchData from 'src/components/FetchData.vue';
|
||||
import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
|
||||
import VnInput from 'src/components/common/VnInput.vue';
|
||||
import FormModel from 'components/FormModel.vue';
|
||||
import VnSelectFilter from 'src/components/common/VnSelectFilter.vue';
|
||||
|
|
@ -28,7 +27,6 @@ const filter = {
|
|||
@on-fetch="(data) => (sectors = data)"
|
||||
auto-load
|
||||
/>
|
||||
<VnSubToolbar />
|
||||
<FormModel :url="`Parkings/${parkingId}`" model="parking" :filter="filter" auto-load>
|
||||
<template #form="{ data }">
|
||||
<VnRow>
|
||||
|
|
|
|||
|
|
@ -1,57 +1,21 @@
|
|||
<script setup>
|
||||
import { onMounted, watch } from 'vue';
|
||||
import { useRoute } from 'vue-router';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { useStateStore } from 'stores/useStateStore';
|
||||
import { useArrayData } from 'src/composables/useArrayData';
|
||||
import LeftMenu from 'components/LeftMenu.vue';
|
||||
import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
|
||||
import VnCard from 'components/common/VnCard.vue';
|
||||
import ParkingDescriptor from 'pages/Parking/Card/ParkingDescriptor.vue';
|
||||
|
||||
const { t } = useI18n();
|
||||
const route = useRoute();
|
||||
const stateStore = useStateStore();
|
||||
|
||||
const filter = {
|
||||
fields: ['id', 'sectorFk', 'code', 'pickingOrder', 'row', 'column'],
|
||||
include: [{ relation: 'sector', scope: { fields: ['id', 'description'] } }],
|
||||
};
|
||||
|
||||
const arrayData = useArrayData('Parking', {
|
||||
url: `Parkings/${route.params.id}`,
|
||||
filter,
|
||||
});
|
||||
const { store } = arrayData;
|
||||
onMounted(async () => await arrayData.fetch({ append: false }));
|
||||
watch(
|
||||
() => route.params.id,
|
||||
async (newId) => {
|
||||
if (newId) {
|
||||
store.url = `Parkings/${newId}`;
|
||||
store.filter = filter;
|
||||
await arrayData.fetch({ append: false });
|
||||
}
|
||||
}
|
||||
);
|
||||
</script>
|
||||
<template>
|
||||
<Teleport to="#searchbar" v-if="stateStore.isHeaderMounted()">
|
||||
<VnSearchbar
|
||||
:info="t('parking.searchBar.info')"
|
||||
:label="t('parking.searchBar.label')"
|
||||
data-key="Parking"
|
||||
/>
|
||||
</Teleport>
|
||||
<QDrawer v-model="stateStore.leftDrawer" show-if-above :width="256">
|
||||
<QScrollArea class="fit">
|
||||
<ParkingDescriptor />
|
||||
<QSeparator />
|
||||
<LeftMenu source="card" />
|
||||
</QScrollArea>
|
||||
</QDrawer>
|
||||
<QPageContainer>
|
||||
<QPage>
|
||||
<RouterView></RouterView>
|
||||
</QPage>
|
||||
</QPageContainer>
|
||||
<VnCard
|
||||
data-key="Parking"
|
||||
base-url="Parkings"
|
||||
:filter="filter"
|
||||
:descriptor="ParkingDescriptor"
|
||||
searchbar-data-key="ParkingList"
|
||||
searchbar-url="Parkings"
|
||||
searchbar-label="parking.searchBar.label"
|
||||
searchbar-info="parking.searchBar.info"
|
||||
/>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -11,9 +11,9 @@ const $props = defineProps({
|
|||
default: 0,
|
||||
},
|
||||
});
|
||||
const { params } = useRoute();
|
||||
const router = useRoute();
|
||||
const { t } = useI18n();
|
||||
const entityId = computed(() => $props.id || params.id);
|
||||
const entityId = computed(() => $props.id || router.params.id);
|
||||
|
||||
const filter = {
|
||||
fields: ['id', 'sectorFk', 'code', 'pickingOrder', 'row', 'column'],
|
||||
|
|
|
|||
|
|
@ -1,22 +1,7 @@
|
|||
<script setup>
|
||||
import { useStateStore } from 'stores/useStateStore';
|
||||
import LeftMenu from 'components/LeftMenu.vue';
|
||||
import VnCard from 'components/common/VnCard.vue';
|
||||
import RouteDescriptor from 'pages/Route/Card/RouteDescriptor.vue';
|
||||
// import ShelvingDescriptor from 'pages/Shelving/Card/ShelvingDescriptor.vue';
|
||||
|
||||
const stateStore = useStateStore();
|
||||
</script>
|
||||
<template>
|
||||
<QDrawer v-model="stateStore.leftDrawer" show-if-above :width="256">
|
||||
<QScrollArea class="fit">
|
||||
<RouteDescriptor />
|
||||
<QSeparator />
|
||||
<LeftMenu source="card" />
|
||||
</QScrollArea>
|
||||
</QDrawer>
|
||||
<QPageContainer>
|
||||
<QPage>
|
||||
<RouterView></RouterView>
|
||||
</QPage>
|
||||
</QPageContainer>
|
||||
<VnCard data-key="Route" base-url="Routes" :descriptor="RouteDescriptor" />
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -1,21 +1,7 @@
|
|||
<script setup>
|
||||
import { useStateStore } from 'stores/useStateStore';
|
||||
import LeftMenu from 'components/LeftMenu.vue';
|
||||
import VnCard from 'components/common/VnCard.vue';
|
||||
import ShelvingDescriptor from 'pages/Shelving/Card/ShelvingDescriptor.vue';
|
||||
|
||||
const stateStore = useStateStore();
|
||||
</script>
|
||||
<template>
|
||||
<QDrawer v-model="stateStore.leftDrawer" show-if-above :width="256">
|
||||
<QScrollArea class="fit">
|
||||
<ShelvingDescriptor />
|
||||
<QSeparator />
|
||||
<LeftMenu source="card" />
|
||||
</QScrollArea>
|
||||
</QDrawer>
|
||||
<QPageContainer>
|
||||
<QPage>
|
||||
<RouterView></RouterView>
|
||||
</QPage>
|
||||
</QPageContainer>
|
||||
<VnCard data-key="Shelving" base-url="Shelvings" :descriptor="ShelvingDescriptor" />
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -1,73 +1,14 @@
|
|||
<script setup>
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { useStateStore } from 'stores/useStateStore';
|
||||
import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
|
||||
import LeftMenu from 'components/LeftMenu.vue';
|
||||
import VnCard from 'components/common/VnCard.vue';
|
||||
import SupplierDescriptor from './SupplierDescriptor.vue';
|
||||
import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
|
||||
import useCardSize from 'src/composables/useCardSize';
|
||||
|
||||
const stateStore = useStateStore();
|
||||
const { t } = useI18n();
|
||||
</script>
|
||||
<template>
|
||||
<template v-if="stateStore.isHeaderMounted()">
|
||||
<Teleport to="#searchbar">
|
||||
<VnSearchbar
|
||||
data-key="SuppliersList"
|
||||
url="Suppliers/filter"
|
||||
:limit="20"
|
||||
:label="t('Search suppliers')"
|
||||
/>
|
||||
</Teleport>
|
||||
</template>
|
||||
<QDrawer v-model="stateStore.leftDrawer" show-if-above :width="256">
|
||||
<QScrollArea class="fit">
|
||||
<SupplierDescriptor />
|
||||
<QSeparator />
|
||||
<LeftMenu source="card" />
|
||||
</QScrollArea>
|
||||
</QDrawer>
|
||||
<QPageContainer>
|
||||
<QPage>
|
||||
<VnSubToolbar />
|
||||
<div :class="useCardSize()">
|
||||
<RouterView></RouterView>
|
||||
</div>
|
||||
</QPage>
|
||||
</QPageContainer>
|
||||
<VnCard
|
||||
data-key="Supplier"
|
||||
base-url="Suppliers"
|
||||
:descriptor="SupplierDescriptor"
|
||||
searchbar-data-key="SupplierList"
|
||||
searchbar-url="Suppliers/filter"
|
||||
searchbar-label="Search suppliers"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<style lang="scss">
|
||||
.q-scrollarea__content {
|
||||
max-width: 100%;
|
||||
}
|
||||
</style>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.descriptor {
|
||||
max-width: 256px;
|
||||
|
||||
h5 {
|
||||
margin: 0 15px;
|
||||
}
|
||||
|
||||
.header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.q-card__actions {
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
#descriptor-skeleton .q-card__actions {
|
||||
justify-content: space-between;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
<i18n>
|
||||
es:
|
||||
Search suppliers: Buscar proveedores
|
||||
</i18n>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<script setup>
|
||||
import { useRoute } from 'vue-router';
|
||||
import { computed, onMounted } from 'vue';
|
||||
import { useRoute } from 'vue-router';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { useQuasar } from 'quasar';
|
||||
|
||||
|
|
@ -33,20 +33,8 @@ const arrayData = useArrayData('SupplierConsumption', {
|
|||
const store = arrayData.store;
|
||||
|
||||
const dateRanges = computed(() => {
|
||||
const ranges = {
|
||||
from: null,
|
||||
to: null,
|
||||
};
|
||||
|
||||
if (route.query && route.query.params) {
|
||||
const params = JSON.parse(route.query.params);
|
||||
if (params.from && params.to) {
|
||||
ranges.from = params.from;
|
||||
ranges.to = params.to;
|
||||
}
|
||||
}
|
||||
|
||||
return ranges;
|
||||
const { from, to } = arrayData.store?.userParams || {};
|
||||
return { from, to };
|
||||
});
|
||||
|
||||
const reportParams = computed(() => ({
|
||||
|
|
@ -117,7 +105,7 @@ onMounted(async () => {
|
|||
<template>
|
||||
<Teleport to="#st-actions" v-if="stateStore.isSubToolbarShown()">
|
||||
<QBtn
|
||||
:disabled="!dateRanges.from && !dateRanges.to"
|
||||
:disabled="!dateRanges.from || !dateRanges.to || !rows.length"
|
||||
color="primary"
|
||||
icon-right="picture_as_pdf"
|
||||
no-caps
|
||||
|
|
@ -129,7 +117,7 @@ onMounted(async () => {
|
|||
</QTooltip>
|
||||
</QBtn>
|
||||
<QBtn
|
||||
:disabled="!dateRanges.from && !dateRanges.to"
|
||||
:disabled="!dateRanges.from || !dateRanges.to || !rows.length"
|
||||
color="primary"
|
||||
icon-right="email"
|
||||
no-caps
|
||||
|
|
@ -140,7 +128,6 @@ onMounted(async () => {
|
|||
</QTooltip>
|
||||
</QBtn>
|
||||
</Teleport>
|
||||
|
||||
<QPage class="column items-center q-pa-md">
|
||||
<QDrawer v-model="stateStore.rightDrawer" side="right" :width="256" show-if-above>
|
||||
<QScrollArea class="fit text-grey-8">
|
||||
|
|
|
|||
|
|
@ -0,0 +1 @@
|
|||
Search suppliers: Buscar proveedores
|
||||
|
|
@ -1,73 +1,15 @@
|
|||
<script setup>
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { useStateStore } from 'stores/useStateStore';
|
||||
import VnCard from 'components/common/VnCard.vue';
|
||||
import TicketDescriptor from './TicketDescriptor.vue';
|
||||
import LeftMenu from 'components/LeftMenu.vue';
|
||||
import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
|
||||
import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
|
||||
import useCardSize from 'src/composables/useCardSize';
|
||||
|
||||
const stateStore = useStateStore();
|
||||
const { t } = useI18n();
|
||||
</script>
|
||||
<template>
|
||||
<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')"
|
||||
/>
|
||||
</Teleport>
|
||||
<QDrawer v-model="stateStore.leftDrawer" show-if-above :width="256">
|
||||
<QScrollArea class="fit">
|
||||
<TicketDescriptor />
|
||||
<QSeparator />
|
||||
<LeftMenu source="card" />
|
||||
</QScrollArea>
|
||||
</QDrawer>
|
||||
<QPageContainer>
|
||||
<QPage>
|
||||
<VnSubToolbar />
|
||||
|
||||
<div :class="useCardSize()">
|
||||
<RouterView></RouterView>
|
||||
</div>
|
||||
</QPage>
|
||||
</QPageContainer>
|
||||
<VnCard
|
||||
data-key="Ticket"
|
||||
base-url="Tickets"
|
||||
:descriptor="TicketDescriptor"
|
||||
searchbar-data-key="TicketList"
|
||||
searchbar-url="Tickets/filter"
|
||||
searchbar-label="Search ticket"
|
||||
searchbar-info="You can search by ticket id or alias"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<style lang="scss">
|
||||
.q-scrollarea__content {
|
||||
max-width: 100%;
|
||||
}
|
||||
</style>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.descriptor {
|
||||
max-width: 256px;
|
||||
|
||||
h5 {
|
||||
margin: 0 15px;
|
||||
}
|
||||
|
||||
.header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.q-card__actions {
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
#descriptor-skeleton .q-card__actions {
|
||||
justify-content: space-between;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
<i18n>
|
||||
es:
|
||||
Search ticket: Buscar ticket
|
||||
You can search by ticket id or alias: Puedes buscar por id o alias del ticket
|
||||
</i18n>
|
||||
|
|
|
|||
|
|
@ -91,8 +91,8 @@ async function changeState(value) {
|
|||
>
|
||||
<template #header="{ entity }">
|
||||
<div>
|
||||
Ticket #{{ entity.id }} - {{ entity.client.name }} ({{
|
||||
entity.client.id
|
||||
Ticket #{{ entity.id }} - {{ entity.client?.name }} ({{
|
||||
entity.client?.id
|
||||
}}) -
|
||||
{{ entity.nickname }}
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,2 @@
|
|||
Search ticket: Buscar ticket
|
||||
You can search by ticket id or alias: Puedes buscar por id o alias del ticket
|
||||
|
|
@ -1,55 +1,7 @@
|
|||
<script setup>
|
||||
import { useStateStore } from 'stores/useStateStore';
|
||||
import VnCard from 'components/common/VnCard.vue';
|
||||
import TravelDescriptor from './TravelDescriptor.vue';
|
||||
import LeftMenu from 'components/LeftMenu.vue';
|
||||
import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
|
||||
import useCardSize from 'src/composables/useCardSize';
|
||||
|
||||
const stateStore = useStateStore();
|
||||
</script>
|
||||
<template>
|
||||
<QDrawer v-model="stateStore.leftDrawer" show-if-above :width="256">
|
||||
<QScrollArea class="fit">
|
||||
<TravelDescriptor />
|
||||
<QSeparator />
|
||||
<LeftMenu source="card" />
|
||||
</QScrollArea>
|
||||
</QDrawer>
|
||||
<QPageContainer>
|
||||
<QPage>
|
||||
<VnSubToolbar />
|
||||
<div :class="useCardSize()">
|
||||
<RouterView></RouterView>
|
||||
</div>
|
||||
</QPage>
|
||||
</QPageContainer>
|
||||
<VnCard data-key="Travel" base-url="Travels" :descriptor="TravelDescriptor" />
|
||||
</template>
|
||||
|
||||
<style lang="scss">
|
||||
.q-scrollarea__content {
|
||||
max-width: 100%;
|
||||
}
|
||||
</style>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.descriptor {
|
||||
max-width: 256px;
|
||||
|
||||
h5 {
|
||||
margin: 0 15px;
|
||||
}
|
||||
|
||||
.header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.q-card__actions {
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
#descriptor-skeleton .q-card__actions {
|
||||
justify-content: space-between;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -1,32 +1,6 @@
|
|||
<script setup>
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { useStateStore } from 'stores/useStateStore';
|
||||
import { useRoute } from 'vue-router';
|
||||
import LeftMenu from 'components/LeftMenu.vue';
|
||||
import useCardSize from 'src/composables/useCardSize';
|
||||
|
||||
const stateStore = useStateStore();
|
||||
const route = useRoute();
|
||||
const { t } = useI18n();
|
||||
import VnCard from 'components/common/VnCard.vue';
|
||||
</script>
|
||||
<template>
|
||||
<QDrawer v-model="stateStore.leftDrawer" show-if-above :width="256">
|
||||
<QScrollArea class="fit">
|
||||
<QSeparator />
|
||||
<LeftMenu source="card" />
|
||||
</QScrollArea>
|
||||
</QDrawer>
|
||||
<QPageContainer>
|
||||
<QPage>
|
||||
<div :class="useCardSize()">
|
||||
<RouterView></RouterView>
|
||||
</div>
|
||||
</QPage>
|
||||
</QPageContainer>
|
||||
<VnCard data-key="Wagon" base-url="Wagons" />
|
||||
</template>
|
||||
|
||||
<i18n>
|
||||
es:
|
||||
Search customer: Buscar cliente
|
||||
You can search by customer id or name: Puedes buscar por id o nombre del cliente
|
||||
</i18n>
|
||||
|
|
|
|||
|
|
@ -178,6 +178,7 @@ watch(_year, (newValue) => {
|
|||
class="outline"
|
||||
bordered
|
||||
transparent-background
|
||||
view-customization="workerCalendar"
|
||||
>
|
||||
<template #header>
|
||||
<span class="full-width text-center text-body1 q-py-sm">{{
|
||||
|
|
@ -222,58 +223,6 @@ watch(_year, (newValue) => {
|
|||
</template>
|
||||
|
||||
<style lang="scss">
|
||||
@import '../../../css/quasar.variables.scss';
|
||||
:root {
|
||||
// Cambia los colores del día actual del calendario por los de salix
|
||||
--calendar-border-current-dark: #84d0e2 2px solid;
|
||||
--calendar-border-current: #84d0e2 2px solid;
|
||||
--calendar-current-color-dark: #ec8916;
|
||||
}
|
||||
|
||||
.q-calendar__button {
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
font-size: 13px;
|
||||
|
||||
&:hover {
|
||||
background-color: var(--vn-accent-color);
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.q-calendar-month__week--days > div:nth-child(6),
|
||||
.q-calendar-month__week--days > div:nth-child(7) {
|
||||
// Cambia el color de los días sábado y domingo
|
||||
color: #777777;
|
||||
}
|
||||
|
||||
.q-calendar-month__week--wrapper {
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
|
||||
.q-calendar-month__workweek {
|
||||
height: 32px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.q-calendar__button--bordered {
|
||||
color: $info !important;
|
||||
}
|
||||
|
||||
.q-calendar-month__day--content {
|
||||
position: absolute;
|
||||
top: 1;
|
||||
left: 0;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.q-outside .calendar-event {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.calendar-event {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
|
|
@ -296,15 +245,6 @@ watch(_year, (newValue) => {
|
|||
opacity: 0.8;
|
||||
}
|
||||
}
|
||||
.q-calendar-month__workweek,
|
||||
.q-calendar-month__head--workweek,
|
||||
.q-calendar-month__head--weekday.q-calendar__center.q-calendar__ellipsis {
|
||||
text-transform: capitalize;
|
||||
color: #777;
|
||||
font-weight: bold;
|
||||
font-size: 0.8rem;
|
||||
text-align: center;
|
||||
}
|
||||
</style>
|
||||
|
||||
<i18n>
|
||||
|
|
|
|||
|
|
@ -1,44 +1,18 @@
|
|||
<script setup>
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { useStateStore } from 'stores/useStateStore';
|
||||
import VnCard from 'components/common/VnCard.vue';
|
||||
import WorkerDescriptor from './WorkerDescriptor.vue';
|
||||
import LeftMenu from 'components/LeftMenu.vue';
|
||||
import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
|
||||
import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
|
||||
import useCardSize from 'src/composables/useCardSize';
|
||||
|
||||
const stateStore = useStateStore();
|
||||
const { t } = useI18n();
|
||||
const filter = { where: {} };
|
||||
</script>
|
||||
<template>
|
||||
<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')"
|
||||
/>
|
||||
</Teleport>
|
||||
<QDrawer v-model="stateStore.leftDrawer" show-if-above :width="256">
|
||||
<QScrollArea class="fit">
|
||||
<WorkerDescriptor />
|
||||
<QSeparator />
|
||||
<LeftMenu source="card" />
|
||||
</QScrollArea>
|
||||
</QDrawer>
|
||||
<QPageContainer>
|
||||
<QPage>
|
||||
<VnSubToolbar />
|
||||
|
||||
<div :class="useCardSize()">
|
||||
<RouterView></RouterView>
|
||||
</div>
|
||||
</QPage>
|
||||
</QPageContainer>
|
||||
<VnCard
|
||||
data-key="Worker"
|
||||
custom-url="Workers/Summary"
|
||||
:descriptor="WorkerDescriptor"
|
||||
:filter="filter"
|
||||
searchbar-data-key="WorkerList"
|
||||
searchbar-url="Workers/filter"
|
||||
searchbar-label="Search worker"
|
||||
searchbar-info="You can search by worker id or name"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<i18n>
|
||||
es:
|
||||
Search worker: Buscar trabajador
|
||||
You can search by worker id or name: Puedes buscar por id o nombre del trabajador
|
||||
</i18n>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,33 @@
|
|||
<script setup>
|
||||
defineProps({
|
||||
color: {
|
||||
type: String,
|
||||
default: null,
|
||||
},
|
||||
avatarClass: {
|
||||
type: String,
|
||||
default: null,
|
||||
},
|
||||
selected: {
|
||||
type: Boolean,
|
||||
default: undefined,
|
||||
},
|
||||
});
|
||||
defineEmits(['update:selected']);
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<QChip
|
||||
class="text-white q-ma-none"
|
||||
:selected="selected"
|
||||
:style="{ backgroundColor: selected ? color : 'black' }"
|
||||
@update:selected="$emit('update:selected', $event)"
|
||||
>
|
||||
<QAvatar
|
||||
:color="color"
|
||||
:class="avatarClass"
|
||||
:style="{ backgroundColor: color }"
|
||||
/>
|
||||
<slot />
|
||||
</QChip>
|
||||
</template>
|
||||
|
|
@ -31,7 +31,9 @@ const entityId = computed(() => {
|
|||
});
|
||||
|
||||
const worker = ref();
|
||||
const filter = { where: { id: route.params.id}};
|
||||
const filter = computed(() => {
|
||||
return { where: { id: entityId.value } };
|
||||
});
|
||||
|
||||
const sip = ref(null);
|
||||
|
||||
|
|
@ -60,7 +62,7 @@ const setData = (entity) => {
|
|||
<CardDescriptor
|
||||
module="Worker"
|
||||
data-key="workerData"
|
||||
:url="`Workers/summary`"
|
||||
url="Workers/summary"
|
||||
:filter="filter"
|
||||
:title="data.title"
|
||||
:subtitle="data.subtitle"
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@ import CardSummary from 'components/ui/CardSummary.vue';
|
|||
import VnUserLink from 'src/components/ui/VnUserLink.vue';
|
||||
import VnTitle from 'src/components/common/VnTitle.vue';
|
||||
|
||||
const { params } = useRoute();
|
||||
const route = useRoute();
|
||||
const { t } = useI18n();
|
||||
|
||||
const $props = defineProps({
|
||||
|
|
@ -20,18 +20,25 @@ const $props = defineProps({
|
|||
},
|
||||
});
|
||||
|
||||
const entityId = computed(() => $props.id || params.id);
|
||||
const entityId = computed(() => $props.id || route.params.id);
|
||||
const workerUrl = ref();
|
||||
|
||||
onMounted(async () => {
|
||||
workerUrl.value = (await getUrl('')) + `worker/${entityId.value}/`;
|
||||
});
|
||||
|
||||
const filter = { where: { id: entityId.value } };
|
||||
const filter = computed(() => {
|
||||
return { where: { id: entityId.value } };
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<CardSummary ref="summary" :url="`Workers/summary`" :filter="filter">
|
||||
<CardSummary
|
||||
data-key="workerData"
|
||||
ref="summary"
|
||||
:url="`Workers/summary`"
|
||||
:filter="filter"
|
||||
>
|
||||
<template #header="{ entity }">
|
||||
<div>{{ entity.id }} - {{ entity.firstName }} {{ entity.lastName }}</div>
|
||||
</template>
|
||||
|
|
@ -41,7 +48,7 @@ const filter = { where: { id: entityId.value } };
|
|||
:url="workerUrl + `basic-data`"
|
||||
:text="t('worker.summary.basicData')"
|
||||
/>
|
||||
<VnLv :label="t('worker.card.name')" :value="worker.user.nickname" />
|
||||
<VnLv :label="t('worker.card.name')" :value="worker.user?.nickname" />
|
||||
<VnLv
|
||||
:label="t('worker.list.department')"
|
||||
:value="worker.department?.department?.name"
|
||||
|
|
|
|||
|
|
@ -0,0 +1,659 @@
|
|||
<script setup>
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { useRoute } from 'vue-router';
|
||||
import { onMounted, ref, computed, onBeforeMount, nextTick, reactive } from 'vue';
|
||||
|
||||
import FetchData from 'components/FetchData.vue';
|
||||
import WorkerTimeHourChip from 'pages/Worker/Card/WorkerTimeHourChip.vue';
|
||||
import WorkerTimeForm from 'pages/Worker/Card/WorkerTimeForm.vue';
|
||||
import WorkerTimeReasonForm from 'pages/Worker/Card/WorkerTimeReasonForm.vue';
|
||||
import WorkerDateLabel from './WorkerDateLabel.vue';
|
||||
import WorkerTimeControlCalendar from 'pages/Worker/Card/WorkerTimeControlCalendar.vue';
|
||||
|
||||
import useNotify from 'src/composables/useNotify.js';
|
||||
import axios from 'axios';
|
||||
import { useRole } from 'src/composables/useRole';
|
||||
import { useWeekdayStore } from 'src/stores/useWeekdayStore';
|
||||
import { useStateStore } from 'stores/useStateStore';
|
||||
import { useState } from 'src/composables/useState';
|
||||
import { dashIfEmpty } from 'src/filters';
|
||||
import { useVnConfirm } from 'composables/useVnConfirm';
|
||||
import { useArrayData } from 'composables/useArrayData';
|
||||
import { toTimeFormat, secondsToHoursMinutes } from 'filters/date.js';
|
||||
import toDateString from 'filters/toDateString.js';
|
||||
import { date } from 'quasar';
|
||||
|
||||
const route = useRoute();
|
||||
const { t, locale } = useI18n();
|
||||
const { notify } = useNotify();
|
||||
const { hasAny } = useRole();
|
||||
const _state = useState();
|
||||
const user = _state.getUser();
|
||||
const stateStore = useStateStore();
|
||||
const weekdayStore = useWeekdayStore();
|
||||
const weekDays = ref([]);
|
||||
const { openConfirmationModal } = useVnConfirm();
|
||||
const { getWeekOfYear } = date;
|
||||
|
||||
const workerTimeFormDialogRef = ref(null);
|
||||
const workerTimeReasonFormDialogRef = ref(null);
|
||||
const workerHoursRef = ref(null);
|
||||
const selectedDate = ref(null);
|
||||
const startOfWeek = ref(null);
|
||||
const endOfWeek = ref(null);
|
||||
const selectedWeekNumber = ref(null);
|
||||
const state = ref(null);
|
||||
const reason = ref(null);
|
||||
const canResend = ref(null);
|
||||
const weekTotalHours = ref(null);
|
||||
const workerTimeControlMails = ref([]);
|
||||
const workerTimeFormProps = reactive({
|
||||
dated: null,
|
||||
entryId: null,
|
||||
entryCode: null,
|
||||
});
|
||||
|
||||
// Array utilizado por QCalendar para seleccionar un rango de fechas
|
||||
const selectedCalendarDates = ref([]);
|
||||
// Date formateada para bindear al componente QDate
|
||||
const selectedDateFormatted = ref(toDateString(Date.vnNew()));
|
||||
|
||||
const arrayData = useArrayData('workerData');
|
||||
|
||||
const worker = computed(() => arrayData.store?.data);
|
||||
|
||||
const isHr = computed(() => hasAny(['hr']));
|
||||
|
||||
const isHimSelf = computed(() => user.value.id === Number(route.params.id));
|
||||
|
||||
const columns = computed(() => {
|
||||
return weekdayStore.getLocales?.map((day, index) => {
|
||||
const obj = {
|
||||
label: day.locale,
|
||||
formattedDate: getHeaderFormattedDate(weekDays.value[index]?.dated),
|
||||
name: day.name,
|
||||
align: 'center',
|
||||
colIndex: index,
|
||||
dayData: weekDays.value[index],
|
||||
};
|
||||
return obj;
|
||||
});
|
||||
});
|
||||
|
||||
const getHeaderFormattedDate = (date) => {
|
||||
const newDate = new Date(date);
|
||||
const day = String(newDate.getDate()).padStart(2, '0');
|
||||
const monthName = newDate.toLocaleString(locale.value, { month: 'long' });
|
||||
return `${day} ${monthName}`;
|
||||
};
|
||||
|
||||
const formattedWeekTotalHours = computed(() =>
|
||||
secondsToHoursMinutes(weekTotalHours.value)
|
||||
);
|
||||
|
||||
const onInputChange = async (date) => {
|
||||
if (!date) return;
|
||||
|
||||
const { year, month, day } = date.scope.timestamp;
|
||||
const _date = new Date(year, month - 1, day);
|
||||
setDate(_date);
|
||||
};
|
||||
|
||||
const setDate = async (date) => {
|
||||
if (!date) return;
|
||||
selectedDate.value = date;
|
||||
selectedDate.value.setHours(0, 0, 0, 0);
|
||||
|
||||
const newStartOfWeek = getStartOfWeek(selectedDate.value); // Obtener el día de inicio de la semana a partir de la fecha seleccionada
|
||||
const newEndOfWeek = getEndOfWeek(newStartOfWeek); // Obtener el fin de la semana a partir de la fecha de inicio de la semana
|
||||
|
||||
startOfWeek.value = newStartOfWeek;
|
||||
endOfWeek.value = newEndOfWeek;
|
||||
selectedWeekNumber.value = getWeekOfYear(newStartOfWeek); // Asignar el número de la semana del año
|
||||
|
||||
getWeekDates(newStartOfWeek, newEndOfWeek);
|
||||
|
||||
await nextTick(); // Esperar actualización del DOM y luego fetchear data necesaria
|
||||
await fetchHours();
|
||||
await fetchWeekData();
|
||||
};
|
||||
|
||||
// Función para obtener el inicio de la semana a partir de una fecha
|
||||
const getStartOfWeek = (selectedDate) => {
|
||||
const dayOfWeek = selectedDate.getDay(); // Obtener el día de la semana de la fecha seleccionada
|
||||
const startOfWeek = new Date(selectedDate);
|
||||
startOfWeek.setDate(selectedDate.getDate() - dayOfWeek + (dayOfWeek === 0 ? -6 : 1)); // Calcular el inicio de la semana
|
||||
return startOfWeek;
|
||||
};
|
||||
|
||||
// Función para obtener el fin de la semana a partir del inicio de la semana
|
||||
const getEndOfWeek = (startOfWeek) => {
|
||||
const endOfWeek = new Date(startOfWeek);
|
||||
endOfWeek.setHours(23, 59, 59, 59);
|
||||
endOfWeek.setDate(startOfWeek.getDate() + 6); // Calcular el fin de la semana sumando 6 días al inicio de la semana
|
||||
return endOfWeek;
|
||||
};
|
||||
|
||||
// Función para obtener las fechas de la semana seleccionada
|
||||
const getWeekDates = (startOfWeek, endOfWeek) => {
|
||||
selectedCalendarDates.value = [];
|
||||
weekDays.value = []; // Limpiar la información de las fechas seleccionadas previamente
|
||||
let currentDate = new Date(startOfWeek);
|
||||
|
||||
while (currentDate <= endOfWeek) {
|
||||
// Iterar sobre los días de la semana
|
||||
selectedCalendarDates.value.push(toDateString(currentDate)); // Agregar fecha formateada para el array de fechas bindeado al componente QCalendar
|
||||
weekDays.value.push({ dated: new Date(currentDate.getTime()) }); // Agregar el día de la semana al array información de días de la semana
|
||||
currentDate = new Date(currentDate.setDate(currentDate.getDate() + 1)); // Avanzar al siguiente día
|
||||
}
|
||||
};
|
||||
|
||||
const workerHoursFilter = computed(() => ({
|
||||
where: {
|
||||
and: [{ timed: { gte: startOfWeek.value } }, { timed: { lte: endOfWeek.value } }],
|
||||
},
|
||||
}));
|
||||
|
||||
const getWorkedHours = async (from, to) => {
|
||||
weekTotalHours.value = null;
|
||||
let _weekTotalHours = 0;
|
||||
let params = {
|
||||
from: from,
|
||||
id: route.params.id,
|
||||
to: to,
|
||||
};
|
||||
|
||||
const { data } = await axios.get(`Workers/${route.params.id}/getWorkedHours`, {
|
||||
params,
|
||||
});
|
||||
|
||||
const workDays = data;
|
||||
const map = new Map();
|
||||
|
||||
for (const workDay of workDays) {
|
||||
workDay.dated = new Date(workDay.dated);
|
||||
map.set(workDay.dated, workDay);
|
||||
_weekTotalHours += workDay.workedHours;
|
||||
}
|
||||
|
||||
for (const weekDay of weekDays.value) {
|
||||
const workDay = workDays.find((day) => {
|
||||
let from = new Date(day.dated);
|
||||
from.setHours(0, 0, 0, 0);
|
||||
|
||||
let to = new Date(day.dated);
|
||||
to.setHours(23, 59, 59, 59);
|
||||
|
||||
return weekDay.dated >= from && weekDay.dated <= to;
|
||||
});
|
||||
|
||||
if (workDay) {
|
||||
weekDay.expectedHours = workDay.expectedHours;
|
||||
weekDay.workedHours = workDay.workedHours;
|
||||
}
|
||||
}
|
||||
weekTotalHours.value = _weekTotalHours;
|
||||
};
|
||||
|
||||
const getAbsences = async () => {
|
||||
const params = {
|
||||
workerFk: route.params.id,
|
||||
businessFk: null,
|
||||
year: startOfWeek.value.getFullYear(),
|
||||
};
|
||||
|
||||
const { data } = await axios.get('Calendars/absences', { params });
|
||||
if (data) addEvents(data);
|
||||
};
|
||||
|
||||
const addEvents = (data) => {
|
||||
const events = {};
|
||||
|
||||
const addEvent = (day, event) => {
|
||||
events[new Date(day).getTime()] = event;
|
||||
};
|
||||
|
||||
if (data.holidays) {
|
||||
data.holidays.forEach((holiday) => {
|
||||
const holidayDetail = holiday.detail && holiday.detail.description;
|
||||
const holidayType = holiday.type && holiday.type.name;
|
||||
const holidayName = holidayDetail || holidayType;
|
||||
|
||||
addEvent(holiday.dated, {
|
||||
name: holidayName,
|
||||
color: '#ff0',
|
||||
});
|
||||
});
|
||||
}
|
||||
if (data.absences) {
|
||||
data.absences.forEach((absence) => {
|
||||
const type = absence.absenceType;
|
||||
addEvent(absence.dated, {
|
||||
name: type.name,
|
||||
color: type.rgb,
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
weekDays.value.forEach((day) => {
|
||||
const timestamp = day.dated.getTime();
|
||||
if (events[timestamp]) day.event = events[timestamp];
|
||||
});
|
||||
};
|
||||
|
||||
const fetchHours = async () => {
|
||||
try {
|
||||
await workerHoursRef.value.fetch();
|
||||
await getWorkedHours(startOfWeek.value, endOfWeek.value);
|
||||
await getAbsences();
|
||||
} catch (err) {
|
||||
console.error('Error fetching worker hours');
|
||||
}
|
||||
};
|
||||
|
||||
const fetchWorkerTimeControlMails = async (filter) => {
|
||||
try {
|
||||
const { data } = await axios.get('WorkerTimeControlMails', {
|
||||
params: { filter: JSON.stringify(filter) },
|
||||
});
|
||||
|
||||
return data;
|
||||
} catch (err) {
|
||||
console.error('Error fetching worker time control mails');
|
||||
}
|
||||
};
|
||||
|
||||
const fetchWeekData = async () => {
|
||||
try {
|
||||
const filter = {
|
||||
where: {
|
||||
workerFk: route.params.id,
|
||||
year: selectedDate.value ? selectedDate.value?.getFullYear() : null,
|
||||
week: selectedWeekNumber.value,
|
||||
},
|
||||
};
|
||||
|
||||
const data = await fetchWorkerTimeControlMails(filter);
|
||||
if (!data.length) {
|
||||
state.value = null;
|
||||
} else {
|
||||
const [mail] = data;
|
||||
state.value = mail.state;
|
||||
reason.value = mail.reason;
|
||||
}
|
||||
|
||||
await canBeResend();
|
||||
} catch (err) {
|
||||
console.error('Error fetching week data');
|
||||
}
|
||||
};
|
||||
|
||||
const canBeResend = async () => {
|
||||
canResend.value = false;
|
||||
|
||||
const filter = {
|
||||
where: {
|
||||
year: selectedDate.value.getFullYear(),
|
||||
week: selectedWeekNumber.value,
|
||||
},
|
||||
limit: 1,
|
||||
};
|
||||
|
||||
const data = await fetchWorkerTimeControlMails(filter);
|
||||
if (data.length) canResend.value = true;
|
||||
};
|
||||
|
||||
const setHours = (data) => {
|
||||
for (const weekDay of weekDays.value) {
|
||||
if (data) {
|
||||
let day = weekDay.dated.getDay();
|
||||
weekDay.hours = data
|
||||
.filter((hour) => new Date(hour.timed).getDay() == day)
|
||||
.sort((a, b) => new Date(a.timed) - new Date(b.timed));
|
||||
} else weekDay.hours = null;
|
||||
}
|
||||
};
|
||||
|
||||
const getFinishTime = () => {
|
||||
if (!weekDays.value || weekDays.value.length === 0) return;
|
||||
|
||||
let today = Date.vnNew();
|
||||
today.setHours(0, 0, 0, 0);
|
||||
|
||||
let todayInWeek = weekDays.value.find(
|
||||
(day) => day.dated.getTime() === today.getTime()
|
||||
);
|
||||
|
||||
if (todayInWeek && todayInWeek.hours && todayInWeek.hours.length) {
|
||||
const remainingTime = todayInWeek.workedHours
|
||||
? (todayInWeek.expectedHours - todayInWeek.workedHours) * 1000
|
||||
: null;
|
||||
const lastKnownEntry = todayInWeek.hours[todayInWeek.hours.length - 1];
|
||||
const lastKnownTime = new Date(lastKnownEntry.timed).getTime();
|
||||
const finishTimeStamp =
|
||||
lastKnownTime && remainingTime ? lastKnownTime + remainingTime : null;
|
||||
|
||||
if (finishTimeStamp) return toTimeFormat(finishTimeStamp) + ' h.';
|
||||
}
|
||||
};
|
||||
|
||||
const updateData = async () => {
|
||||
await fetchHours();
|
||||
await getMailStates(selectedDate.value);
|
||||
};
|
||||
|
||||
const getMailStates = async (date) => {
|
||||
const params = {
|
||||
month: date.getMonth() + 1,
|
||||
year: date.getFullYear(),
|
||||
};
|
||||
|
||||
const { data } = await axios.get(
|
||||
`WorkerTimeControls/${route.params.id}/getMailStates`,
|
||||
{ params }
|
||||
);
|
||||
workerTimeControlMails.value = data;
|
||||
};
|
||||
|
||||
const showWorkerTimeForm = (propValue, formType) => {
|
||||
const isEditForm = formType === 'edit';
|
||||
|
||||
workerTimeFormProps.entryId = isEditForm ? propValue.id : null;
|
||||
workerTimeFormProps.entryCode = isEditForm ? propValue.entryCode : null;
|
||||
workerTimeFormProps.dated = isEditForm ? null : propValue;
|
||||
|
||||
workerTimeFormDialogRef.value.show();
|
||||
};
|
||||
|
||||
const showReasonForm = () => {
|
||||
workerTimeReasonFormDialogRef.value.show();
|
||||
};
|
||||
|
||||
const updateWorkerTimeControlMail = async (state, reason) => {
|
||||
try {
|
||||
const params = {
|
||||
workerId: Number(route.params.id),
|
||||
year: selectedDate.value.getFullYear(),
|
||||
week: selectedWeekNumber.value,
|
||||
state,
|
||||
};
|
||||
|
||||
if (reason) params.reason = reason;
|
||||
|
||||
await axios.post('WorkerTimeControls/updateWorkerTimeControlMail', params);
|
||||
await getMailStates(selectedDate.value);
|
||||
await fetchWeekData();
|
||||
notify(t('globals.dataSaved'), 'positive');
|
||||
} catch (err) {
|
||||
console.error('Error updating worker time control mail');
|
||||
}
|
||||
};
|
||||
|
||||
const isSatisfied = async () => {
|
||||
await updateWorkerTimeControlMail('CONFIRMED');
|
||||
};
|
||||
|
||||
const isUnsatisfied = async (reason) => {
|
||||
if (!reason) {
|
||||
notify(t('You must indicate a reason', 'negative'));
|
||||
return;
|
||||
}
|
||||
updateWorkerTimeControlMail('REVISE', reason);
|
||||
};
|
||||
|
||||
const resendEmail = async () => {
|
||||
try {
|
||||
const params = {
|
||||
recipient: worker.value?.user?.email,
|
||||
week: selectedWeekNumber.value,
|
||||
year: selectedDate.value.getFullYear(),
|
||||
workerId: Number(route.params.id),
|
||||
state: 'SENDED',
|
||||
};
|
||||
await axios.post('WorkerTimeControls/weekly-hour-hecord-email', params);
|
||||
await getMailStates(selectedDate.value);
|
||||
notify(t('Email sended'), 'positive');
|
||||
} catch (err) {
|
||||
console.error('Error sending email');
|
||||
}
|
||||
};
|
||||
|
||||
onBeforeMount(() => {
|
||||
weekdayStore.initStore();
|
||||
});
|
||||
|
||||
onMounted(async () => {
|
||||
await setDate(Date.vnNew());
|
||||
await getMailStates(selectedDate.value);
|
||||
stateStore.rightDrawer = true;
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<FetchData
|
||||
ref="workerHoursRef"
|
||||
url="WorkerTimeControls/filter"
|
||||
:filter="workerHoursFilter"
|
||||
:params="{
|
||||
workerFk: route.params.id,
|
||||
}"
|
||||
@on-fetch="(data) => setHours(data)"
|
||||
/>
|
||||
<Teleport to="#st-actions" v-if="stateStore?.isSubToolbarShown()">
|
||||
<div>
|
||||
<QBtnGroup push class="q-gutter-x-sm" flat>
|
||||
<QBtn
|
||||
v-if="isHimSelf && state"
|
||||
:label="t('Satisfied')"
|
||||
color="primary"
|
||||
type="submit"
|
||||
:disabled="state == 'CONFIRMED'"
|
||||
@click="isSatisfied()"
|
||||
/>
|
||||
<QBtn
|
||||
v-if="isHimSelf && state"
|
||||
:label="t('Not satisfied')"
|
||||
color="primary"
|
||||
type="submit"
|
||||
:disabled="state == 'REVISE'"
|
||||
@click="showReasonForm()"
|
||||
style="margin-left: 1px"
|
||||
/>
|
||||
</QBtnGroup>
|
||||
<QBtnGroup push class="q-gutter-x-sm" flat style="margin-left: 0px">
|
||||
<QBtn
|
||||
v-if="reason && state && (isHimSelf || isHr)"
|
||||
:label="t('Reason')"
|
||||
color="primary"
|
||||
type="submit"
|
||||
@click="showReasonForm()"
|
||||
/>
|
||||
<QBtn
|
||||
v-if="isHr && state !== 'CONFIRMED' && canResend"
|
||||
:label="state ? t('Resend') : t('globals.send')"
|
||||
color="primary"
|
||||
type="submit"
|
||||
@click="
|
||||
openConfirmationModal(
|
||||
t('Send time control email'),
|
||||
t('Are you sure you want to send it?'),
|
||||
resendEmail
|
||||
)
|
||||
"
|
||||
>
|
||||
<QTooltip>
|
||||
{{ state ? t('Resend') : t('globals.send') }}
|
||||
{{ t('email of this week to the user') }}
|
||||
</QTooltip>
|
||||
</QBtn>
|
||||
</QBtnGroup>
|
||||
</div>
|
||||
</Teleport>
|
||||
<template v-if="stateStore.isHeaderMounted()">
|
||||
<Teleport to="#actions-append">
|
||||
<div class="row q-gutter-x-sm">
|
||||
<QBtn
|
||||
flat
|
||||
@click="stateStore.toggleRightDrawer()"
|
||||
round
|
||||
dense
|
||||
icon="menu"
|
||||
>
|
||||
<QTooltip bottom anchor="bottom right">
|
||||
{{ t('globals.collapseMenu') }}
|
||||
</QTooltip>
|
||||
</QBtn>
|
||||
</div>
|
||||
</Teleport>
|
||||
</template>
|
||||
<QDrawer v-model="stateStore.rightDrawer" side="right" :width="260" class="q-pa-md">
|
||||
<div class="q-pa-md q-mb-md" style="border: 2px solid #222">
|
||||
<QCardSection horizontal>
|
||||
<span class="text-weight-bold text-subtitle1 text-center full-width">
|
||||
{{ t('Hours') }}
|
||||
</span>
|
||||
</QCardSection>
|
||||
<QCardSection class="column items-center" horizontal>
|
||||
<div>
|
||||
<span class="details-label">{{ t('Total semana') }} </span>
|
||||
<span>: {{ formattedWeekTotalHours }}</span>
|
||||
</div>
|
||||
<div>
|
||||
<span class="details-label">{{ t('Termina a las') }}: </span>
|
||||
<span>{{ dashIfEmpty(getFinishTime()) }}</span>
|
||||
</div>
|
||||
</QCardSection>
|
||||
</div>
|
||||
<WorkerTimeControlCalendar
|
||||
v-model:model-value="selectedDateFormatted"
|
||||
:selected-dates="selectedCalendarDates"
|
||||
:active-date="false"
|
||||
:worker-time-control-mails="workerTimeControlMails"
|
||||
@click-date="onInputChange"
|
||||
@on-moved="getMailStates"
|
||||
/>
|
||||
</QDrawer>
|
||||
<QPage class="column items-center">
|
||||
<QTable :columns="columns" :rows="['']" hide-bottom class="full-width">
|
||||
<template #header="props">
|
||||
<QTr :props="props" no-hover>
|
||||
<QTh
|
||||
v-for="col in props.cols"
|
||||
:key="col.name"
|
||||
:props="props"
|
||||
auto-width
|
||||
style="vertical-align: top"
|
||||
>
|
||||
<div class="column-title-container">
|
||||
<span class="text-primary">{{ t(col.label) }}</span>
|
||||
<span class="q-mb-xs">{{ col.formattedDate }}</span>
|
||||
<WorkerDateLabel
|
||||
v-if="col.dayData?.event"
|
||||
:color="col.dayData.event.color"
|
||||
>
|
||||
<span>
|
||||
{{ col.dayData.event.name }}
|
||||
</span>
|
||||
</WorkerDateLabel>
|
||||
</div>
|
||||
</QTh>
|
||||
</QTr>
|
||||
</template>
|
||||
<template #body="props">
|
||||
<QTr no-hover>
|
||||
<QTd
|
||||
v-for="(day, index) in props.cols"
|
||||
:key="index"
|
||||
style="padding: 20px 16px !important"
|
||||
>
|
||||
<div class="full-height full-width column items-center">
|
||||
<WorkerTimeHourChip
|
||||
v-for="(hour, ind) in day.dayData?.hours"
|
||||
:key="ind"
|
||||
:hour="hour.timed"
|
||||
:manual="hour.manual"
|
||||
:direction="hour.direction"
|
||||
:id="hour.id"
|
||||
@on-hour-entry-deleted="updateData()"
|
||||
@show-worker-time-form="
|
||||
showWorkerTimeForm(
|
||||
{ id: hour.id, entryCode: hour.direction },
|
||||
'edit'
|
||||
)
|
||||
"
|
||||
class="hour-chip"
|
||||
/>
|
||||
</div>
|
||||
</QTd>
|
||||
</QTr>
|
||||
<QTr no-hover>
|
||||
<QTd v-for="(day, index) in props.cols" :key="index">
|
||||
<div class="column items-center justify-center">
|
||||
<span class="q-mb-md text-sm text-body1">
|
||||
{{ secondsToHoursMinutes(day.dayData?.workedHours) }}
|
||||
</span>
|
||||
<QIcon
|
||||
name="add_circle"
|
||||
color="primary"
|
||||
class="fill-icon cursor-pointer"
|
||||
size="sm"
|
||||
@click="showWorkerTimeForm(day.dayData?.dated, 'create')"
|
||||
>
|
||||
<QTooltip>{{ t('Add time') }}</QTooltip>
|
||||
</QIcon>
|
||||
</div>
|
||||
</QTd>
|
||||
</QTr>
|
||||
</template>
|
||||
</QTable>
|
||||
<QDialog ref="workerTimeFormDialogRef">
|
||||
<WorkerTimeForm v-bind="workerTimeFormProps" @on-data-saved="updateData()" />
|
||||
</QDialog>
|
||||
<QDialog ref="workerTimeReasonFormDialogRef">
|
||||
<WorkerTimeReasonForm
|
||||
@on-submit="isUnsatisfied($event)"
|
||||
:reason="reason"
|
||||
:is-him-self="isHimSelf"
|
||||
/>
|
||||
</QDialog>
|
||||
</QPage>
|
||||
</template>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.column-title-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.details-label {
|
||||
color: var(--vn-label);
|
||||
}
|
||||
|
||||
.hour-chip {
|
||||
margin-bottom: 16px;
|
||||
|
||||
&:last-child {
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
<i18n>
|
||||
es:
|
||||
Hours: Horas
|
||||
Total semana: Total semana
|
||||
Termina a las: Termina a las
|
||||
Add time: Añadir hora
|
||||
Reason: Motivo
|
||||
Not satisfied: No conforme
|
||||
Satisfied: Conforme
|
||||
Resend: Reenviar
|
||||
email of this week to the user: email de esta semana al usuario
|
||||
Email sended: Email enviado
|
||||
Send time control email: Enviar email control horario
|
||||
Are you sure you want to send it?: ¿Seguro que quieres enviarlo?
|
||||
You must indicate a reason: Debes indicar un motivo
|
||||
</i18n>
|
||||
|
|
@ -0,0 +1,171 @@
|
|||
<script setup>
|
||||
import { ref, computed, watch } from 'vue';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
|
||||
import { QCalendarMonth } from '@quasar/quasar-ui-qcalendar/src/index.js';
|
||||
import QCalendarMonthWrapper from 'src/components/ui/QCalendarMonthWrapper.vue';
|
||||
|
||||
const $props = defineProps({
|
||||
modelValue: {
|
||||
type: String,
|
||||
default: '',
|
||||
},
|
||||
selectedDates: {
|
||||
type: Array,
|
||||
default: () => [],
|
||||
},
|
||||
showNavigation: {
|
||||
type: Boolean,
|
||||
default: true,
|
||||
},
|
||||
activeDate: {
|
||||
type: Boolean,
|
||||
default: true,
|
||||
},
|
||||
workerTimeControlMails: {
|
||||
type: Array,
|
||||
default: () => [],
|
||||
},
|
||||
});
|
||||
|
||||
const emit = defineEmits(['update:modelValue', 'clickDate', 'onMoved']);
|
||||
|
||||
const { locale } = useI18n();
|
||||
|
||||
const calendarRef = ref(null);
|
||||
|
||||
const stateClasses = {
|
||||
CONFIRMED: {
|
||||
className: 'confirmed',
|
||||
title: 'Conforme',
|
||||
},
|
||||
REVISE: {
|
||||
className: 'revise',
|
||||
title: 'No conforme',
|
||||
},
|
||||
SENDED: {
|
||||
className: 'sended',
|
||||
title: 'Pendiente',
|
||||
},
|
||||
};
|
||||
|
||||
const value = computed({
|
||||
get: () => $props.modelValue,
|
||||
set: (val) => emit('update:modelValue', val),
|
||||
});
|
||||
|
||||
const formattedNavigationLabel = computed(() => {
|
||||
const [year, month, day] = $props.modelValue.split('-');
|
||||
const date = new Date(year, month - 1, day);
|
||||
const _month = date.toLocaleString(locale.value, { month: 'long' });
|
||||
return `${_month.charAt(0).toUpperCase() + _month.slice(1)} ${year}`;
|
||||
});
|
||||
|
||||
const workerTimeControlMailsMap = computed(() => {
|
||||
if (!$props.workerTimeControlMails || !$props.workerTimeControlMails.length)
|
||||
return new Map();
|
||||
|
||||
const map = new Map();
|
||||
$props.workerTimeControlMails.forEach((mail) => map.set(mail.week, mail.state));
|
||||
return map;
|
||||
});
|
||||
|
||||
const onPrev = () => {
|
||||
calendarRef.value.prev();
|
||||
};
|
||||
|
||||
const onNext = () => {
|
||||
calendarRef.value.next();
|
||||
};
|
||||
|
||||
const clickDate = (ev) => {
|
||||
emit('clickDate', ev);
|
||||
};
|
||||
|
||||
const onMoved = (ev) => {
|
||||
emit('onMoved', new Date(ev.year, ev.month - 1, ev.day));
|
||||
};
|
||||
|
||||
const workWeeksElements = ref([]);
|
||||
|
||||
watch(
|
||||
() => $props.workerTimeControlMails,
|
||||
() => {
|
||||
getWorkWeekElements();
|
||||
paintWorkWeeks();
|
||||
}
|
||||
);
|
||||
|
||||
const getWorkWeekElements = () => {
|
||||
workWeeksElements.value = document.getElementsByClassName(
|
||||
'q-calendar-month__workweek'
|
||||
);
|
||||
};
|
||||
|
||||
const paintWorkWeeks = async () => {
|
||||
for (var i = 0; i < workWeeksElements.value.length; i++) {
|
||||
const element = workWeeksElements.value[i];
|
||||
const week = Number(element.innerHTML);
|
||||
const weekState = workerTimeControlMailsMap.value.get(week);
|
||||
const { className, title } = stateClasses[weekState] || {};
|
||||
|
||||
element.classList.remove('confirmed', 'revise', 'sended');
|
||||
|
||||
if (className) {
|
||||
element.classList.add(className);
|
||||
element.setAttribute('title', title);
|
||||
} else {
|
||||
element.removeAttribute('title');
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<QCalendarMonthWrapper>
|
||||
<template #header>
|
||||
<div class="row items-center full-width">
|
||||
<QIcon name="arrow_back_ios" class="nav-arrow col" @click="onPrev" />
|
||||
<span class="col-6 text-no-wrap text-center text-subtitle1">{{
|
||||
formattedNavigationLabel
|
||||
}}</span>
|
||||
<QIcon name="arrow_forward_ios" class="nav-arrow col" @click="onNext" />
|
||||
</div>
|
||||
</template>
|
||||
<template #calendar>
|
||||
<QCalendarMonth
|
||||
ref="calendarRef"
|
||||
v-model="value"
|
||||
show-work-weeks
|
||||
:weekdays="[1, 2, 3, 4, 5, 6, 0]"
|
||||
:selected-dates="selectedDates"
|
||||
:locale="locale"
|
||||
mini-mode
|
||||
enable-outside-days
|
||||
class="q-py-sm"
|
||||
no-active-date
|
||||
@click-date="clickDate"
|
||||
@moved="onMoved"
|
||||
/>
|
||||
</template>
|
||||
</QCalendarMonthWrapper>
|
||||
</template>
|
||||
|
||||
<style lang="scss">
|
||||
.confirmed {
|
||||
color: #97b92f;
|
||||
}
|
||||
|
||||
.revise {
|
||||
color: #f61e1e;
|
||||
}
|
||||
|
||||
.sended {
|
||||
color: #d19b25;
|
||||
}
|
||||
|
||||
.nav-arrow {
|
||||
cursor: pointer;
|
||||
user-select: none;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,109 @@
|
|||
<script setup>
|
||||
import { reactive, ref, computed, onBeforeMount } from 'vue';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { useRoute } from 'vue-router';
|
||||
|
||||
import VnSelectFilter from 'src/components/common/VnSelectFilter.vue';
|
||||
import FormModelPopup from 'components/FormModelPopup.vue';
|
||||
import VnInputTime from 'components/common/VnInputTime.vue';
|
||||
|
||||
const $props = defineProps({
|
||||
entryId: {
|
||||
type: Number,
|
||||
default: null,
|
||||
},
|
||||
entryCode: {
|
||||
type: String,
|
||||
default: null,
|
||||
},
|
||||
dated: {
|
||||
type: Date,
|
||||
default: true,
|
||||
},
|
||||
});
|
||||
|
||||
const emit = defineEmits(['onDataSaved']);
|
||||
|
||||
const route = useRoute();
|
||||
const { t } = useI18n();
|
||||
|
||||
let workerHourEntry = reactive({});
|
||||
|
||||
const entryDirections = [
|
||||
{ code: 'in', description: t('Entrada') },
|
||||
{ code: 'middle', description: t('Intermedio') },
|
||||
{ code: 'out', description: t('Salida') },
|
||||
];
|
||||
|
||||
const closeButton = ref(null);
|
||||
|
||||
const onDataSaved = () => {
|
||||
emit('onDataSaved');
|
||||
closeForm();
|
||||
};
|
||||
|
||||
const closeForm = () => {
|
||||
if (closeButton.value) closeButton.value.click();
|
||||
};
|
||||
|
||||
const isEditMode = computed(() => !!$props.entryId);
|
||||
|
||||
const title = computed(() => (isEditMode.value ? t('Edit entry') : t('Add time')));
|
||||
|
||||
const urlCreate = computed(() =>
|
||||
isEditMode.value
|
||||
? `WorkerTimeControls/${$props.entryId}/updateTimeEntry`
|
||||
: `WorkerTimeControls/${route.params.id}/addTimeEntry`
|
||||
);
|
||||
|
||||
onBeforeMount(() => {
|
||||
workerHourEntry = isEditMode.value
|
||||
? { direction: $props.entryCode }
|
||||
: {
|
||||
timed: new Date($props.dated),
|
||||
workerFk: route.params.id,
|
||||
};
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<FormModelPopup
|
||||
:form-initial-data="workerHourEntry"
|
||||
:observe-form-changes="false"
|
||||
:default-actions="false"
|
||||
:title="title"
|
||||
:url-create="urlCreate"
|
||||
@on-data-saved="onDataSaved()"
|
||||
>
|
||||
<template #form-inputs="{ data }">
|
||||
<VnInputTime
|
||||
v-if="!isEditMode"
|
||||
:label="t('Hour')"
|
||||
v-model="data.timed"
|
||||
autofocus
|
||||
:required="true"
|
||||
:is-clearable="false"
|
||||
/>
|
||||
<VnSelectFilter
|
||||
:label="t('Type')"
|
||||
v-model="data.direction"
|
||||
:options="entryDirections"
|
||||
option-value="code"
|
||||
option-label="description"
|
||||
hide-selected
|
||||
:required="true"
|
||||
/>
|
||||
</template>
|
||||
</FormModelPopup>
|
||||
</template>
|
||||
|
||||
<i18n>
|
||||
es:
|
||||
Add time: Añadir hora
|
||||
Edit entry: Editar entrada
|
||||
Hour: Hora
|
||||
Type: Tipo
|
||||
Entrada: Entrada
|
||||
Intermedio: Intermedio
|
||||
Salida: Salida
|
||||
</i18n>
|
||||
|
|
@ -0,0 +1,143 @@
|
|||
<script setup>
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { computed } from 'vue';
|
||||
|
||||
import useNotify from 'src/composables/useNotify.js';
|
||||
import { useVnConfirm } from 'composables/useVnConfirm';
|
||||
import { toTimeFormat } from 'filters/date.js';
|
||||
import axios from 'axios';
|
||||
|
||||
const $props = defineProps({
|
||||
id: {
|
||||
type: Number,
|
||||
required: true,
|
||||
},
|
||||
manual: {
|
||||
type: Boolean,
|
||||
required: true,
|
||||
},
|
||||
hour: {
|
||||
type: String,
|
||||
required: true,
|
||||
},
|
||||
direction: {
|
||||
type: String,
|
||||
required: true,
|
||||
default: null,
|
||||
},
|
||||
});
|
||||
|
||||
const emit = defineEmits(['onHourEntryDeleted', 'showWorkerTimeForm']);
|
||||
|
||||
const { t } = useI18n();
|
||||
const { notify } = useNotify();
|
||||
const { openConfirmationModal } = useVnConfirm();
|
||||
|
||||
const directionIconTooltip = computed(() => {
|
||||
const tooltipDictionary = {
|
||||
in: t('Entrada'),
|
||||
out: t('Salida'),
|
||||
};
|
||||
return tooltipDictionary[$props.direction] || null;
|
||||
});
|
||||
|
||||
const directionIconName = computed(() => {
|
||||
const tooltipDictionary = {
|
||||
in: 'arrow_forward',
|
||||
out: 'arrow_back',
|
||||
};
|
||||
return tooltipDictionary[$props.direction] || null;
|
||||
});
|
||||
|
||||
const deleteHourEntry = async () => {
|
||||
try {
|
||||
const { data } = await axios.post(
|
||||
`WorkerTimeControls/${$props.id}/deleteTimeEntry`
|
||||
);
|
||||
|
||||
if (!data) return;
|
||||
emit('onHourEntryDeleted');
|
||||
notify('Entry removed', 'positive');
|
||||
} catch (err) {
|
||||
console.error('Error deleting hour entry');
|
||||
}
|
||||
};
|
||||
|
||||
const showWorkerTimeForm = () => emit('showWorkerTimeForm');
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="row items-center no-wrap">
|
||||
<QIcon class="direction-icon" :name="directionIconName" size="sm">
|
||||
<QTooltip>{{ directionIconTooltip }}</QTooltip>
|
||||
</QIcon>
|
||||
<QBadge
|
||||
rounded
|
||||
class="chip"
|
||||
:class="{ '--manual': manual }"
|
||||
@click="showWorkerTimeForm()"
|
||||
>
|
||||
<QIcon name="edit" size="sm" class="fill-icon">
|
||||
<QTooltip>{{ t('Edit') }}</QTooltip></QIcon
|
||||
>
|
||||
<span class="q-px-sm text-subtitle2 text-weight-regular">{{
|
||||
toTimeFormat(hour)
|
||||
}}</span>
|
||||
<QIcon
|
||||
v-if="manual"
|
||||
name="cancel"
|
||||
class="remove-icon"
|
||||
size="sm"
|
||||
@click.stop="
|
||||
openConfirmationModal(
|
||||
t('This time entry will be deleted'),
|
||||
t('Are you sure you want to delete this entry?'),
|
||||
deleteHourEntry
|
||||
)
|
||||
"
|
||||
/>
|
||||
</QBadge>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.chip {
|
||||
height: 28px;
|
||||
cursor: pointer;
|
||||
opacity: 0.8;
|
||||
color: #eee;
|
||||
background-color: #222;
|
||||
|
||||
&.--manual {
|
||||
color: var(--vn-accent-color);
|
||||
background-color: $primary;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.direction-icon {
|
||||
color: var(--vn-label-color);
|
||||
margin-right: 6px;
|
||||
}
|
||||
|
||||
.remove-icon {
|
||||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
font-variation-settings: 'FILL' 1;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
<i18n>
|
||||
es:
|
||||
Entrada: Entrada
|
||||
Salida: Salida
|
||||
Edit: Editar
|
||||
This time entry will be deleted: Se eliminará la hora fichada
|
||||
Are you sure you want to delete this entry?: ¿Seguro que quieres eliminarla?
|
||||
Entry removed: Fichada borrada
|
||||
</i18n>
|
||||
|
|
@ -0,0 +1,52 @@
|
|||
<script setup>
|
||||
import { ref } from 'vue';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
|
||||
import FormPopup from 'components/FormPopup.vue';
|
||||
|
||||
const $props = defineProps({
|
||||
reason: {
|
||||
type: String,
|
||||
default: '',
|
||||
},
|
||||
isHimSelf: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
});
|
||||
|
||||
const emit = defineEmits(['onSubmit']);
|
||||
|
||||
const { t } = useI18n();
|
||||
|
||||
const closeButton = ref(null);
|
||||
const reasonFormData = ref($props.reason);
|
||||
|
||||
const onSubmit = () => {
|
||||
emit('onSubmit', reasonFormData.value);
|
||||
closeForm();
|
||||
};
|
||||
|
||||
const closeForm = () => {
|
||||
if (closeButton.value) closeButton.value.click();
|
||||
};
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<FormPopup @on-submit="onSubmit()">
|
||||
<template #form-inputs>
|
||||
<QInput
|
||||
:label="t('Reason')"
|
||||
v-model="reasonFormData"
|
||||
type="textarea"
|
||||
autogrow
|
||||
:disable="!isHimSelf"
|
||||
/>
|
||||
</template>
|
||||
</FormPopup>
|
||||
</template>
|
||||
|
||||
<i18n>
|
||||
es:
|
||||
Reason: Motivo
|
||||
</i18n>
|
||||
|
|
@ -0,0 +1,2 @@
|
|||
Search worker: Buscar trabajador
|
||||
You can search by worker id or name: Puedes buscar por id o nombre del trabajador
|
||||
|
|
@ -21,6 +21,7 @@ export default {
|
|||
'WorkerLog',
|
||||
'WorkerCalendar',
|
||||
'WorkerDms',
|
||||
'WorkerTimeControl',
|
||||
],
|
||||
departmentCard: ['BasicData'],
|
||||
},
|
||||
|
|
@ -156,6 +157,16 @@ export default {
|
|||
},
|
||||
component: () => import('src/pages/Worker/Card/WorkerCalendar.vue'),
|
||||
},
|
||||
{
|
||||
name: 'WorkerTimeControl',
|
||||
path: 'time-control',
|
||||
meta: {
|
||||
title: 'timeControl',
|
||||
icon: 'access_time',
|
||||
},
|
||||
component: () =>
|
||||
import('src/pages/Worker/Card/WorkerTimeControl.vue'),
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
|
|
|
|||
|
|
@ -60,11 +60,13 @@ export const useWeekdayStore = defineStore('weekdayStore', () => {
|
|||
// El día de mañana esto permitirá ordenar los weekdays en base a el locale si se lo desea reemplazando localeOrder.es por localeOrder[locale]
|
||||
const locales = [];
|
||||
for (let code of localeOrder.es) {
|
||||
const weekDay = weekdaysMap[code];
|
||||
const locale = t(`weekdays.${weekdaysMap[code].code}`);
|
||||
const obj = {
|
||||
...weekdaysMap[code],
|
||||
locale: t(`weekdays.${weekdaysMap[code].code}`),
|
||||
localeChar: t(`weekdays.${weekdaysMap[code].code}`).substr(0, 1),
|
||||
localeAbr: t(`weekdays.${weekdaysMap[code].code}`).substr(0, 3),
|
||||
...weekDay,
|
||||
locale,
|
||||
localeChar: locale.substr(0, 1),
|
||||
localeAbr: locale.substr(0, 3),
|
||||
};
|
||||
locales.push(obj);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,5 +1,6 @@
|
|||
const locationOptions = '[role="listbox"] > div.q-virtual-scroll__content > .q-item';
|
||||
describe('VnLocation', () => {
|
||||
const dialogInputs = '.q-dialog label input';
|
||||
describe('Create', () => {
|
||||
const inputLocation =
|
||||
'.q-form .q-card> :nth-child(3) > :nth-child(1) > .q-field > .q-field__inner > .q-field__control';
|
||||
|
|
@ -39,13 +40,9 @@ describe('VnLocation', () => {
|
|||
cy.get(
|
||||
':nth-child(6) > :nth-child(1) > .q-field > .q-field__inner > .q-field__control > :nth-child(3) > .q-icon'
|
||||
).click();
|
||||
cy.get(' .q-card > h1').should('have.text', 'New postcode');
|
||||
cy.get(
|
||||
'.q-card > :nth-child(4) > :nth-child(1) > .q-field > .q-field__inner > .q-field__control > :nth-child(1) > input'
|
||||
).clear('12');
|
||||
cy.get(
|
||||
'.q-card > :nth-child(4) > :nth-child(1) > .q-field > .q-field__inner > .q-field__control > :nth-child(1) > input'
|
||||
).type('1234453');
|
||||
cy.get('.q-card > h1').should('have.text', 'New postcode');
|
||||
cy.get(dialogInputs).eq(0).clear('12');
|
||||
cy.get(dialogInputs).eq(0).type('1234453');
|
||||
cy.selectOption(
|
||||
'.q-dialog__inner > .column > #formModel > .q-card > :nth-child(4) > :nth-child(2) > .q-field > .q-field__inner > .q-field__control ',
|
||||
'Valencia'
|
||||
|
|
|
|||
|
|
@ -21,7 +21,8 @@ describe('ClaimPhoto', () => {
|
|||
cy.get('.q-notification__message').should('have.text', 'Data saved');
|
||||
});
|
||||
|
||||
it('should open first image dialog change to second and close', () => {
|
||||
/* it.skip('should open first image dialog change to second and close', () => {
|
||||
skiped fix on https://redmine.verdnatura.es/issues/7113
|
||||
cy.get(
|
||||
':nth-child(1) > .q-card > .q-img > .q-img__container > .q-img__image'
|
||||
).click();
|
||||
|
|
@ -37,7 +38,7 @@ describe('ClaimPhoto', () => {
|
|||
cy.get('.q-carousel__slide > .q-img > .q-img__container > .q-img__image').should(
|
||||
'not.be.visible'
|
||||
);
|
||||
});
|
||||
}); */
|
||||
|
||||
it('should remove third and fourth file', () => {
|
||||
cy.get(
|
||||
|
|
|
|||
|
|
@ -1,7 +1,6 @@
|
|||
/// <reference types="cypress" />
|
||||
describe('InvoiceInDueDay', () => {
|
||||
const inputs = 'label input';
|
||||
const inputBtns = 'label button';
|
||||
const addBtn = '.q-page-sticky > div > .q-btn > .q-btn__content';
|
||||
|
||||
beforeEach(() => {
|
||||
|
|
@ -10,7 +9,6 @@ describe('InvoiceInDueDay', () => {
|
|||
});
|
||||
|
||||
it('should update the amount', () => {
|
||||
cy.get(inputBtns).eq(1).click();
|
||||
cy.get(inputs).eq(3).type(23);
|
||||
cy.saveCard();
|
||||
cy.get('.q-notification__message').should('have.text', 'Data saved');
|
||||
|
|
|
|||
|
|
@ -1,11 +1,11 @@
|
|||
/// <reference types="cypress" />
|
||||
describe('InvoiceInVat', () => {
|
||||
const inputs = 'label input';
|
||||
const inputBtns = 'label button';
|
||||
const thirdRow = 'tbody > :nth-child(3)';
|
||||
const firstLineVat = 'tbody > :nth-child(1) > :nth-child(4)';
|
||||
const dialogInputs = '.q-dialog label input';
|
||||
const dialogBtns = '.q-dialog button';
|
||||
const acrossInput =
|
||||
':nth-child(1) > .q-td.q-table--col-auto-width > .q-field > .q-field__inner > .q-field__control > :nth-child(2) > .default-icon';
|
||||
const randomInt = Math.floor(Math.random() * 100);
|
||||
|
||||
beforeEach(() => {
|
||||
|
|
@ -13,11 +13,8 @@ describe('InvoiceInVat', () => {
|
|||
cy.visit(`/#/invoice-in/1/vat`);
|
||||
});
|
||||
|
||||
it('should edit the first line', () => {
|
||||
cy.get(inputBtns).eq(1).click();
|
||||
cy.get(inputs).eq(2).type(23);
|
||||
it('should edit the sage iva', () => {
|
||||
cy.selectOption(firstLineVat, 'H.P. IVA 21% CEE');
|
||||
|
||||
cy.saveCard();
|
||||
cy.visit(`/#/invoice-in/1/vat`);
|
||||
|
||||
|
|
@ -36,16 +33,13 @@ describe('InvoiceInVat', () => {
|
|||
});
|
||||
|
||||
it('should throw an error if there are fields undefined', () => {
|
||||
cy.get(inputBtns).eq(0).click();
|
||||
cy.get(':nth-child(1) > .q-td.q-table--col-auto-width > .q-field > .q-field__inner > .q-field__control > :nth-child(2) > .default-icon').click();
|
||||
cy.get(acrossInput).click();
|
||||
cy.get(dialogBtns).eq(2).click();
|
||||
cy.get('.q-notification__message').should('have.text', "The code can't be empty");
|
||||
});
|
||||
|
||||
it('should correctly handle expense addition', () => {
|
||||
cy.get(inputBtns).eq(0).click();
|
||||
|
||||
cy.get(':nth-child(1) > .q-td.q-table--col-auto-width > .q-field > .q-field__inner > .q-field__control > :nth-child(2) > .default-icon').click();
|
||||
cy.get(acrossInput).click();
|
||||
cy.get(dialogInputs).eq(0).type(randomInt);
|
||||
cy.get(dialogInputs).eq(1).click();
|
||||
cy.get(dialogInputs).eq(1).type('This is a dummy expense');
|
||||
|
|
|
|||
|
|
@ -48,7 +48,7 @@ describe('VnPaginate', () => {
|
|||
{ id: 3, name: 'Bruce Wayne' },
|
||||
],
|
||||
});
|
||||
vm.arrayData.hasMoreData.value = true;
|
||||
vm.store.hasMoreData = true;
|
||||
await vm.$nextTick();
|
||||
|
||||
vm.store.data = [
|
||||
|
|
|
|||
Loading…
Reference in New Issue