verdnatura/salix-front
verdnatura
/
salix-front
1
2
Fork 1
Code Issues Pull Requests 59 Releases Wiki Activity

Merge pull request 'refs #7366 VnTable' (!489) from 7366-travelMigration2 into dev
gitea/salix-front/pipeline/head This commit looks good Details 

Reviewed-on: #489
Reviewed-by: Alex Moreno <alexm@verdnatura.es>
This commit is contained in:
Alex Moreno 2024-07-03 08:32:57 +00:00
parent 6f21e165a2 1463cc8904
commit eeaf7d00e2
6 changed files with 200 additions and 136 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/composables/useArrayData.js
View File

@ -19,7 +19,6 @@ export function useArrayData(key = useRoute().meta.moduleName, userOptions) {
onMounted(() => {
setOptions();
store.skip = 0;
const query = route.query;
const searchUrl = store.searchUrl;
if (query[searchUrl]) {

10
src/i18n/locale/en.yml
View File

@ -1142,6 +1142,16 @@ supplier:
date: Date
reference: Reference
travel:
travelList:
tableVisibleColumns:
id: Id
ref: Reference
agency: Agency
shipped: Shipped
landed: Landed
warehouseIn: Warehouse in
warehouseOut: Warehouse out
totalEntries: Total entries
summary:
confirmed: Confirmed
entryId: Entry Id

10
src/i18n/locale/es.yml
View File

@ -1115,6 +1115,16 @@ supplier:
date: Fecha
reference: Referencia
travel:
travelList:
tableVisibleColumns:
id: Id
ref: Referencia
agency: Agencia
shipped: Enviado
landed: Llegada
warehouseIn: Almacén de salida
warehouseOut: Almacén de entrada
totalEntries: Total de entradas
summary:
confirmed: Confirmado
entryId: Id entrada

6
src/pages/Travel/Card/TravelCard.vue
View File

@ -33,8 +33,12 @@ const filter = {
<template>
<VnCard
data-key="Travel"
:filter="filter"
base-url="Travels"
search-data-key="TravelList"
searchbar-label="Search travel"
searchbar-info="You can search by travel id or name"
search-url="Travels"
:filter="filter"
:descriptor="TravelDescriptor"
/>
</template>

2
src/pages/Travel/Card/TravelSummary.vue
View File

@ -12,8 +12,6 @@ import FetchData from 'src/components/FetchData.vue';
import { toDate, toCurrency } from 'src/filters';
import axios from 'axios';
onUpdated(() => summaryRef.value.fetch());
const $props = defineProps({
id: {
type: Number,

307
src/pages/Travel/TravelList.vue
View File

@ -2,31 +2,27 @@
import { onMounted, ref } from 'vue';
import { useI18n } from 'vue-i18n';
import { useRouter } from 'vue-router';
import VnPaginate from 'src/components/ui/VnPaginate.vue';
import CardList from 'src/components/ui/CardList.vue';
import VnLv from 'src/components/ui/VnLv.vue';
import TravelSummary from './Card/TravelSummary.vue';
import TravelFilter from './TravelFilter.vue';
import FetchData from 'components/FetchData.vue';
import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
import { useRoute } from 'vue-router';
import { useStateStore } from 'stores/useStateStore';
import { toDate } from 'src/filters/index';
import VnTable from 'components/VnTable/VnTable.vue';
import { useSummaryDialog } from 'src/composables/useSummaryDialog';
import { getDateQBadgeColor } from 'src/composables/getDateQBadgeColor.js';
import RightMenu from 'src/components/common/RightMenu.vue';
import { computed } from 'vue';
import TravelSummary from './Card/TravelSummary.vue';
import VnSearchbar from 'components/ui/VnSearchbar.vue';
import { dashIfEmpty, toDate } from 'src/filters';
const { viewSummary } = useSummaryDialog();
const router = useRouter();
const { t } = useI18n();
const stateStore = useStateStore();
const { viewSummary } = useSummaryDialog();
const warehouses = ref([]);
const navigateToTravelId = (id) => {
router.push({ path: `/travel/${id}` });
};
const route = useRoute();
const tableRef = ref();
const $props = defineProps({
id: {
type: Number,
default: 0,
},
});
const entityId = computed(() => $props.id || route.params.id);
const cloneTravel = (travelData) => {
const stringifiedTravelData = JSON.stringify(travelData);
redirectToCreateView(stringifiedTravelData);
@ -40,125 +36,170 @@ const redirectCreateEntryView = (travelData) => {
router.push({ name: 'EntryCreate', query: { travelFk: travelData.id } });
};
const getWarehouseName = (id) => {
return warehouses.value.find((warehouse) => warehouse.id === id).name;
};
onMounted(async () => {
stateStore.rightDrawer = true;
});
const columns = computed(() => [
{
align: 'left',
name: 'id',
label: t('travel.travelList.tableVisibleColumns.id'),
isId: true,
field: 'id',
cardVisible: true,
},
{
align: 'left',
name: 'ref',
label: t('travel.travelList.tableVisibleColumns.ref'),
field: 'ref',
component: 'input',
columnField: {
component: null,
},
cardVisible: true,
create: true,
},
{
align: 'left',
name: 'agencyModeFk',
label: t('travel.travelList.tableVisibleColumns.agency'),
field: 'agencyModeFk',
component: 'select',
attrs: {
url: 'agencyModes',
fields: ['id', 'name'],
},
columnField: {
component: null,
},
cardVisible: true,
create: true,
},
{
align: 'left',
name: 'shipped',
label: t('travel.travelList.tableVisibleColumns.shipped'),
field: 'shipped',
component: 'date',
columnField: {
component: null,
},
cardVisible: true,
create: true,
format: (row, dashIfEmpty) => dashIfEmpty(toDate(row.shipped)),
},
{
align: 'left',
name: 'landed',
label: t('travel.travelList.tableVisibleColumns.landed'),
field: 'landed',
component: 'date',
columnField: {
component: null,
},
cardVisible: true,
create: true,
format: (row, dashIfEmpty) => dashIfEmpty(toDate(row.landed)),
},
{
align: 'left',
name: 'warehouseInFk',
label: t('travel.travelList.tableVisibleColumns.warehouseIn'),
field: 'warehouseInFk',
component: 'select',
attrs: {
url: 'warehouses',
fields: ['id', 'name'],
},
columnField: {
component: null,
},
cardVisible: true,
create: true,
},
{
align: 'left',
name: 'warehouseOutFk',
label: t('travel.travelList.tableVisibleColumns.warehouseOut'),
field: 'warehouseOutFk',
component: 'select',
attrs: {
url: 'warehouses',
fields: ['id', 'name'],
},
columnField: {
component: null,
},
cardVisible: true,
create: true,
},
{
align: 'left',
name: 'totalEntries',
label: t('travel.travelList.tableVisibleColumns.totalEntries'),
field: 'totalEntries',
component: 'input',
columnField: {
component: null,
},
cardVisible: true,
create: true,
},
{
align: 'right',
label: '',
name: 'tableActions',
actions: [
{
title: t('Clone'),
icon: 'vn:clone',
action: cloneTravel,
isPrimary: true,
},
{
title: t('Add entry'),
icon: 'contact_support',
action: redirectCreateEntryView,
},
{
title: t('View Summary'),
icon: 'preview',
action: (row) => viewSummary(row.id, TravelSummary),
},
],
},
]);
</script>
<template>
<FetchData
url="Warehouses"
:filter="{ fields: ['id', 'name'] }"
order="name"
@on-fetch="(data) => (warehouses = data)"
auto-load
<VnSearchbar
:info="t('You can search by travel id or name')"
:label="t('Search travel')"
data-key="TravelList"
/>
<VnTable
ref="tableRef"
data-key="TravelList"
url="Travels"
:create="{
urlCreate: 'Travels',
title: t('Create Travels'),
onDataSaved: ({ id }) => tableRef.redirect(id),
formInitialData: {
editorFk: entityId,
},
}"
order="landed DESC"
:columns="columns"
default-mode="table"
auto-load
redirect="travel"
:right-search="false"
:is-editable="false"
:use-model="true"
/>
<VnSearchbar data-key="TravelList" :limit="20" :label="t('searchByIdOrReference')" />
<RightMenu>
<template #right-panel>
<TravelFilter data-key="TravelList" />
</template>
</RightMenu>
<QPage class="column items-center q-pa-md">
<div class="vn-card-list">
<VnPaginate
data-key="TravelList"
url="Travels/filter"
auto-load
order="shipped DESC, landed DESC"
>
<template #body="{ rows }">
<CardList
v-for="row of rows"
:key="row.id"
:title="row.ref"
:id="row.id"
@click="navigateToTravelId(row.id)"
>
<template #list-items>
<VnLv
:label="t('globals.agency')"
:value="row.agencyModeName"
/>
<VnLv
v-if="warehouses.length > 0"
:label="t('globals.wareHouseOut')"
:value="getWarehouseName(row.warehouseOutFk)"
/>
<VnLv :label="t('globals.shipped')">
<template #value>
<QBadge
text-color="black"
v-if="getDateQBadgeColor(row.shipped)"
:color="getDateQBadgeColor(row.shipped)"
class="q-ma-none"
dense
style="font-size: 14px"
>
{{ toDate(row.shipped) }}
</QBadge>
<span v-else>{{ toDate(row.shipped) }}</span>
</template>
</VnLv>
<VnLv :label="t('globals.landed')">
<template #value>
<QBadge
text-color="black"
v-if="getDateQBadgeColor(row.landed)"
:color="getDateQBadgeColor(row.landed)"
class="q-ma-none"
dense
style="font-size: 14px"
>
{{ toDate(row.landed) }}
</QBadge>
<span v-else>{{ toDate(row.landed) }}</span>
</template>
</VnLv>
<VnLv
v-if="warehouses.length > 0"
:label="t('globals.wareHouseIn')"
:value="getWarehouseName(row.warehouseInFk)"
/>
<VnLv
:label="t('globals.totalEntries')"
:value="row.totalEntries"
/>
</template>
<template #actions>
<QBtn
:label="t('components.smartCard.clone')"
@click.stop="cloneTravel(row)"
outline
/>
<QBtn
:label="t('addEntry')"
@click.stop="redirectCreateEntryView(row)"
outline
style="margin-top: 15px"
/>
<QBtn
:label="t('components.smartCard.openSummary')"
@click.stop="viewSummary(row.id, TravelSummary)"
color="primary"
style="margin-top: 15px"
/>
</template>
</CardList>
</template>
</VnPaginate>
</div>
<QPageSticky :offset="[20, 20]">
<QBtn fab icon="add" color="primary" @click="redirectToCreateView()" />
<QTooltip>
{{ t('supplier.list.newSupplier') }}
</QTooltip>
</QPageSticky>
</QPage>
</template>
<i18n>
@ -169,4 +210,6 @@ en:
es:
addEntry: Añadir entrada
searchByIdOrReference: Buscar por ID o por referencia
You can search by travel id or name: Buscar por envio por id o nombre
Search travel: Buscar envio
</i18n>