salix-front/src/pages/Entry/MyEntries.vue

144 lines
3.4 KiB
Vue

<script setup>
import { computed } from 'vue';
import { useI18n } from 'vue-i18n';
import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
import { toDate } from 'src/filters/index';
import { useQuasar } from 'quasar';
import EntryBuysTableDialog from './EntryBuysTableDialog.vue';
import VnTable from 'components/VnTable/VnTable.vue';
const { t } = useI18n();
const quasar = useQuasar();
const params = {
daysOnward: 7,
daysAgo: 3,
};
const columns = computed(() => [
{
align: 'left',
name: 'id',
label: t('myEntries.id'),
columnFilter: false,
isTitle: true,
},
{
visible: false,
align: 'right',
label: t('myEntries.shipped'),
name: 'shipped',
columnFilter: {
name: 'fromShipped',
label: t('myEntries.fromShipped'),
component: 'date',
},
format: ({ shipped }) => toDate(shipped),
},
{
visible: false,
align: 'left',
label: t('myEntries.shipped'),
name: 'shipped',
columnFilter: {
name: 'toShipped',
label: t('myEntries.toShipped'),
component: 'date',
},
format: ({ shipped }) => toDate(shipped),
cardVisible: true,
},
{
align: 'right',
label: t('myEntries.shipped'),
name: 'shipped',
columnFilter: false,
format: ({ shipped }) => toDate(shipped),
},
{
align: 'right',
label: t('myEntries.landed'),
name: 'landed',
columnFilter: false,
format: ({ landed }) => toDate(landed),
},
{
align: 'right',
label: t('myEntries.wareHouseIn'),
name: 'warehouseInFk',
format: (row) => {
row.warehouseInName;
},
cardVisible: true,
columnFilter: {
name: 'warehouseInFk',
label: t('myEntries.warehouseInFk'),
component: 'select',
attrs: {
url: 'warehouses',
fields: ['id', 'name'],
optionLabel: 'name',
optionValue: 'id',
alias: 't',
},
inWhere: true,
},
},
{
align: 'left',
label: t('myEntries.daysOnward'),
name: 'daysOnward',
visible: false,
},
{
align: 'left',
label: t('myEntries.daysAgo'),
name: 'daysAgo',
visible: false,
},
{
align: 'right',
name: 'tableActions',
actions: [
{
title: t('myEntries.printLabels'),
icon: 'move_item',
isPrimary: true,
action: (row) => printBuys(row.id),
},
],
},
]);
const printBuys = (rowId) => {
quasar.dialog({
component: EntryBuysTableDialog,
componentProps: {
id: rowId,
},
});
};
</script>
<template>
<VnSearchbar
data-key="myEntriesList"
url="Entries/filter"
:label="t('Search entries')"
:info="t('You can search by entry reference')"
/>
<VnTable
data-key="myEntriesList"
url="Entries/filter"
:columns="columns"
:user-params="params"
default-mode="card"
order="shipped DESC"
auto-load
chip-locale="myEntries"
/>
</template>
<i18n>
You can search by entry reference: Puedes buscar por referencia de la entrada
</i18n>