Merge pull request 'feature/ms-138-EntryDescriptor' (#72) from feature/ms-138-EntryDescriptor into dev

Reviewed-on: hyervoni/salix-front-mindshore#72
This commit is contained in:
William Buezas 2024-01-17 20:35:48 +00:00
commit 13de9a4b23
9 changed files with 240 additions and 30 deletions

View File

@ -1,8 +1,7 @@
<script setup>
import { onMounted, useSlots, ref, watch, computed } from 'vue';
import { onMounted, useSlots, watch, computed } from 'vue';
import { useI18n } from 'vue-i18n';
import { useQuasar } from 'quasar';
import axios from 'axios';
import SkeletonDescriptor from 'components/ui/SkeletonDescriptor.vue';
import { useArrayData } from 'composables/useArrayData';

View File

@ -335,6 +335,11 @@ export default {
buyingValue: 'Buying value',
packagingFk: 'Box',
},
descriptor: {
agency: 'Agency',
landed: 'Landed',
warehouseOut: 'Warehouse Out',
},
},
ticket: {
pageTitles: {

View File

@ -334,6 +334,11 @@ export default {
buyingValue: 'Coste',
packagingFk: 'Embalaje',
},
descriptor: {
agency: 'Agency',
landed: 'F. entrega',
warehouseOut: 'Alm. salida',
},
},
ticket: {
pageTitles: {

View File

@ -1,15 +1,29 @@
<script setup>
import { useStateStore } from 'stores/useStateStore';
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 EntryDescriptor from './EntryDescriptor.vue';
import { useStateStore } from 'stores/useStateStore';
const { t } = useI18n();
const stateStore = useStateStore();
</script>
<template>
<!-- Entry searchbar -->
<template v-if="stateStore.isHeaderMounted()">
<Teleport to="#searchbar">
<VnSearchbar
data-key="EntryList"
: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 -->
<EntryDescriptor />
<QSeparator />
<LeftMenu source="card" />
</QScrollArea>
@ -22,3 +36,9 @@ const stateStore = useStateStore();
</QPage>
</QPageContainer>
</template>
<i18n>
es:
Search entries: Buscar entradas
You can search by entry reference: Puedes buscar por referencia de la entrada
</i18n>

View File

@ -0,0 +1,165 @@
<script setup>
import { ref, computed, onMounted } from 'vue';
import { useRoute } from 'vue-router';
import { useI18n } from 'vue-i18n';
import CardDescriptor from 'components/ui/CardDescriptor.vue';
import VnLv from 'src/components/ui/VnLv.vue';
import useCardDescription from 'src/composables/useCardDescription';
import { toDate } from 'src/filters';
const $props = defineProps({
id: {
type: Number,
required: false,
default: null,
},
summary: {
type: Object,
default: null,
},
});
const route = useRoute();
const { t } = useI18n();
const entryFilter = {
include: [
{
relation: 'travel',
scope: {
fields: ['id', 'landed', 'agencyModeFk', 'warehouseOutFk'],
include: [
{
relation: 'agency',
scope: {
fields: ['name'],
},
},
{
relation: 'warehouseOut',
scope: {
fields: ['name'],
},
},
{
relation: 'warehouseIn',
scope: {
fields: ['name'],
},
},
],
},
},
{
relation: 'supplier',
scope: {
fields: ['id', 'nickname'],
},
},
],
};
const getEntryRedirectionFilter = (entry) => {
let entryTravel = entry && entry.travel;
if (!entryTravel || !entryTravel.landed) return null;
const date = new Date(entryTravel.landed);
date.setHours(0, 0, 0, 0);
const from = new Date(date.getTime());
from.setDate(from.getDate() - 10);
const to = new Date(date.getTime());
to.setDate(to.getDate() + 10);
return JSON.stringify({
supplierFk: entry.supplierFk,
from,
to,
});
};
const entityId = computed(() => {
return $props.id || route.params.id;
});
const data = ref(useCardDescription());
const setData = (entity) =>
(data.value = useCardDescription(entity.supplier.nickname, entity.id));
</script>
<template>
<CardDescriptor
module="Entry"
:url="`Entries/${entityId}`"
:filter="entryFilter"
:title="data.title"
:subtitle="data.subtitle"
@on-fetch="setData"
data-key="entryData"
>
<template #body="{ entity }">
<VnLv
:label="t('entry.descriptor.agency')"
:value="entity.travel.agency.name"
/>
<VnLv
:label="t('entry.descriptor.landed')"
:value="toDate(entity.travel.landed)"
/>
<VnLv
:label="t('entry.descriptor.warehouseOut')"
:value="entity.travel.warehouseOut.name"
/>
</template>
<template #actions="{ entity }">
<QCardActions>
<QBtn
:to="`/supplier/${entity.supplier.id}`"
size="md"
icon="vn:supplier"
color="primary"
>
<QTooltip>{{ t('Supplier card') }}</QTooltip>
</QBtn>
<QBtn
:to="{
name: 'TravelMain',
query: {
params: JSON.stringify({
agencyModeFk: entity.travel?.agencyModeFk,
}),
},
}"
size="md"
icon="local_airport"
color="primary"
>
<QTooltip>{{ t('All travels with current agency') }}</QTooltip>
</QBtn>
<QBtn
:to="{
name: 'EntryMain',
query: {
params: getEntryRedirectionFilter(entity),
},
}"
size="md"
icon="vn:entry"
color="primary"
>
<QTooltip>{{ t('All entries with current supplier') }}</QTooltip>
</QBtn>
</QCardActions>
</template>
</CardDescriptor>
</template>
<i18n>
es:
Supplier card: Ficha del proveedor
All travels with current agency: Todos los envíos con la agencia actual
All entries with current supplier: Todas las entradas con el proveedor actual
</i18n>

View File

@ -0,0 +1,16 @@
<script setup>
import EntryDescriptor from './EntryDescriptor.vue';
const $props = defineProps({
id: {
type: Number,
required: true,
},
});
</script>
<template>
<QPopupProxy>
<EntryDescriptor v-if="$props.id" :id="$props.id" />
</QPopupProxy>
</template>

View File

@ -1,28 +1,19 @@
<script setup>
import { onMounted, onUnmounted } from 'vue';
import { useI18n } from 'vue-i18n';
import { useRouter } from 'vue-router';
import { useQuasar } from 'quasar';
import VnPaginate from 'src/components/ui/VnPaginate.vue';
import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
import VnLv from 'src/components/ui/VnLv.vue';
import CardList from 'src/components/ui/CardList.vue';
import EntrySummaryDialog from './Card/EntrySummaryDialog.vue';
import { useStateStore } from 'stores/useStateStore';
import { toDate } from 'src/filters/index';
const stateStore = useStateStore();
const router = useRouter();
const quasar = useQuasar();
const { t } = useI18n();
onMounted(async () => {
stateStore.rightDrawer = true;
});
onUnmounted(() => (stateStore.rightDrawer = false));
function navigate(id) {
router.push({ path: `/entry/${id}` });
}
@ -42,16 +33,6 @@ function viewSummary(id) {
</script>
<template>
<template v-if="stateStore.isHeaderMounted()">
<Teleport to="#searchbar">
<VnSearchbar
data-key="EntryList"
:label="t('Search entries')"
:info="t('You can search by entry reference')"
/>
</Teleport>
</template>
<QPage class="column items-center q-pa-md">
<div class="card-list">
<VnPaginate

View File

@ -1,11 +1,24 @@
<script setup>
import { useStateStore } from 'stores/useStateStore';
import { useI18n } from 'vue-i18n';
import LeftMenu from 'src/components/LeftMenu.vue';
import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
import { useStateStore } from 'stores/useStateStore';
const { t } = useI18n();
const stateStore = useStateStore();
</script>
<template>
<template v-if="stateStore.isHeaderMounted()">
<Teleport to="#searchbar">
<VnSearchbar
data-key="EntryList"
: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 text-grey-8">
<LeftMenu />
@ -15,3 +28,9 @@ const stateStore = useStateStore();
<RouterView></RouterView>
</QPageContainer>
</template>
<i18n>
es:
Search entries: Buscar entradas
You can search by entry reference: Puedes buscar por referencia de la entrada
</i18n>

View File

@ -9,6 +9,7 @@ import TravelDescriptorProxy from 'src/pages/Travel/Card/TravelDescriptorProxy.v
import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
import ExtraCommunityFilter from './ExtraCommunityFilter.vue';
import VnInput from 'src/components/common/VnInput.vue';
import EntryDescriptorProxy from '../Entry/Card/EntryDescriptorProxy.vue';
import { useStateStore } from 'stores/useStateStore';
import { toCurrency } from 'src/filters';
@ -231,7 +232,7 @@ const navigateToTravelId = (id) => {
};
const stopEventPropagation = (event, col) => {
if (!['ref', 'id', 'supplier'].includes(col.name)) return;
if (!['ref', 'id', 'cargoSupplierNickname'].includes(col.name)) return;
event.preventDefault();
event.stopPropagation();
};
@ -359,10 +360,9 @@ onMounted(async () => {
:props="props"
class="secondary-row"
>
<QTd
><QBtn flat color="blue" class="col-content">{{ entry.id }}</QBtn>
<!-- Cuando se cree el modulo relacionado a entries, crear su descriptor y colocarlo acá -->
<!-- <EntryDescriptorProxy :id="entry.id"/> -->
<QTd>
<QBtn flat color="blue" class="col-content">{{ entry.id }} </QBtn>
<EntryDescriptorProxy :id="entry.id" />
</QTd>
<QTd
><QBtn flat color="blue" class="col-content">{{