wbuezas
/
salix-front-mindshore-fork2
forked from verdnatura/salix-front
0
0
Fork 0
Code Pull Requests Activity

Item shelvings

This commit is contained in:
William Buezas 2024-04-30 16:15:48 -03:00
parent 34797450af
commit ac219bfbb7
6 changed files with 315 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -1135,6 +1135,7 @@ item:
tax: Tax
barcode: Barcode
botanical: Botanical
shelving: Shelving
descriptor:
item: Item
buyer: Buyer

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

@ -1134,6 +1134,7 @@ item:
botanical: 'Botánico'
barcode: 'Código de barras'
log: Historial
shelving: Carros
descriptor:
item: Artículo
buyer: Comprador

275
src/pages/Item/Card/ItemShelving.vue Normal file
View File

@ -0,0 +1,275 @@
<script setup>
import { onMounted, ref, computed, reactive } from 'vue';
import { useI18n } from 'vue-i18n';
import { useRoute } from 'vue-router';
import FetchData from 'components/FetchData.vue';
import VnInput from 'src/components/common/VnInput.vue';
import VnSelect from 'src/components/common/VnSelect.vue';
import ItemDescriptorProxy from 'src/pages/Item/Card/ItemDescriptorProxy.vue';
import { toDateFormat } from 'src/filters/date.js';
import { dashIfEmpty } from 'src/filters';
import { useArrayData } from 'src/composables/useArrayData';
import useNotify from 'src/composables/useNotify.js';
import { useVnConfirm } from 'composables/useVnConfirm';
import axios from 'axios';
const route = useRoute();
const { t } = useI18n();
const { notify } = useNotify();
const { openConfirmationModal } = useVnConfirm();
const rowsSelected = ref([]);
const parkingsOptions = ref([]);
const shelvingsOptions = ref([]);
const exprBuilder = (param, value) => {
switch (param) {
case 'parking':
case 'shelving':
case 'label':
case 'packing':
case 'itemFk':
return { [param]: value };
}
};
const params = reactive({ itemFk: route.params.id });
const arrayData = useArrayData('ItemShelvings', {
url: 'ItemShelvingPlacementSupplyStocks',
userParams: params,
exprBuilder: exprBuilder,
});
const rows = computed(() => arrayData.store.data || []);
const applyColumnFilter = async (col) => {
try {
const paramKey = col.columnFilter?.filterParamKey || col.field;
params[paramKey] = col.columnFilter.filterValue;
await arrayData.addFilter({ filter: null, params });
} catch (err) {
console.error('Error applying column filter', err);
}
};
const getInputEvents = (col) => {
return col.columnFilter.type === 'select'
? { 'update:modelValue': () => applyColumnFilter(col) }
: {
'keyup.enter': () => applyColumnFilter(col),
};
};
const columns = computed(() => [
{
label: t('shelvings.created'),
name: 'created',
field: 'created',
align: 'left',
sortable: true,
columnFilter: null,
format: (val) => toDateFormat(val),
},
{
label: t('shelvings.item'),
name: 'item',
field: 'itemFk',
align: 'left',
sortable: true,
columnFilter: null,
},
{
label: t('shelvings.concept'),
name: 'concept',
align: 'left',
sortable: true,
columnFilter: null,
},
{
label: t('shelvings.parking'),
name: 'parking',
field: 'parking',
align: 'left',
sortable: true,
format: (val) => dashIfEmpty(val),
columnFilter: {
component: VnSelect,
type: 'select',
filterValue: null,
event: getInputEvents,
attrs: {
options: parkingsOptions.value,
'option-value': 'code',
'option-label': 'code',
dense: true,
},
},
},
{
label: t('shelvings.shelving'),
name: 'shelving',
field: 'shelving',
align: 'left',
sortable: true,
format: (val) => dashIfEmpty(val),
columnFilter: {
component: VnSelect,
type: 'select',
filterValue: null,
event: getInputEvents,
attrs: {
options: shelvingsOptions.value,
'option-value': 'code',
'option-label': 'code',
dense: true,
},
},
},
{
label: t('shelvings.label'),
name: 'label',
align: 'left',
sortable: true,
format: (_, row) => (row.stock / row.packing).toFixed(2),
columnFilter: {
component: VnInput,
type: 'text',
filterParamKey: 'label',
filterValue: null,
event: getInputEvents,
attrs: {
dense: true,
},
},
},
{
label: t('shelvings.packing'),
field: 'packing',
name: 'packing',
align: 'left',
sortable: true,
columnFilter: {
component: VnInput,
type: 'text',
filterValue: null,
event: getInputEvents,
attrs: {
dense: true,
},
},
format: (val) => dashIfEmpty(val),
},
]);
const totalLabels = computed(() =>
rows.value.reduce((acc, row) => acc + row.stock / row.packing, 0).toFixed(2)
);
const removeLines = async () => {
try {
const itemShelvingIds = rowsSelected.value.map((row) => row.itemShelvingFk);
await axios.post('ItemShelvings/deleteItemShelvings', { itemShelvingIds });
rowsSelected.value = [];
notify('shelvings.shelvingsRemoved', 'positive');
await arrayData.fetch({ append: false });
} catch (err) {
console.error('Error removing lines', err);
}
};
onMounted(async () => {
await arrayData.fetch({ append: false });
});
</script>
<template>
<FetchData
url="parkings"
:filter="{ fields: ['code'], order: 'code ASC' }"
auto-load
@on-fetch="(data) => (parkingsOptions = data)"
/>
<FetchData
url="shelvings"
:filter="{ fields: ['code'], order: 'code ASC' }"
auto-load
@on-fetch="(data) => (shelvingsOptions = data)"
/>
<QToolbar class="bg-vn-dark justify-end">
<div id="st-data" class="q-py-sm flex items-center">
<div class="q-pa-md q-mr-lg" style="border: 2px solid #222">
<QCardSection horizontal>
<span class="text-weight-bold text-subtitle1 text-center full-width">
{{ t('shelvings.total') }}
</span>
</QCardSection>
<QCardSection class="column items-center" horizontal>
<div>
<span class="details-label"
>{{ t('shelvings.totalLabels') }}
</span>
<span>: {{ totalLabels }}</span>
</div>
</QCardSection>
</div>
<QBtn
color="primary"
icon="delete"
:disabled="!rowsSelected.length"
@click="
openConfirmationModal(
t('shelvings.removeConfirmTitle'),
t('shelvings.removeConfirmSubtitle'),
removeLines
)
"
>
<QTooltip>
{{ t('shelvings.removeLines') }}
</QTooltip>
</QBtn>
</div>
<QSpace />
<div id="st-actions"></div>
</QToolbar>
<QPage class="column items-center q-pa-md">
<QTable
:rows="rows"
:columns="columns"
row-key="id"
:pagination="{ rowsPerPage: 0 }"
class="full-width q-mt-md"
selection="multiple"
v-model:selected="rowsSelected"
:no-data-label="t('globals.noResults')"
>
<template #top-row="{ cols }">
<QTr>
<QTd />
<QTd
v-for="(col, index) in cols"
:key="index"
style="max-width: 100px"
>
<component
:is="col.columnFilter.component"
v-if="col.columnFilter"
v-model="col.columnFilter.filterValue"
v-bind="col.columnFilter.attrs"
v-on="col.columnFilter.event(col)"
dense
/>
</QTd>
</QTr>
</template>
<template #body-cell-concept="{ row }">
<QTd @click.stop>
<span class="link">{{ row.longName }}</span>
<ItemDescriptorProxy :id="row.itemFk" />
</QTd>
</template>
</QTable>
</QPage>
</template>

14
src/pages/Item/locale/en.yml Normal file
View File

@ -0,0 +1,14 @@
shelvings:
created: Created
item: Item
concept: Concept
parking: Parking
shelving: Shelving
label: Label
packing: Packing
total: Total
totalLabels: Total labels
removeLines: Remove selected lines
shelvingsRemoved: ItemShelvings removed
removeConfirmTitle: Selected lines will be deleted
removeConfirmSubtitle: Are you sure you want to continue?

14
src/pages/Item/locale/es.yml Normal file
View File

@ -0,0 +1,14 @@
shelvings:
created: Creado
item: Artículo
concept: Concepto
parking: Parking
shelving: Matrícula
label: Etiqueta
packing: Packing
total: Total
totalLabels: Total etiquetas
removeLines: Eliminar líneas seleccionadas
shelvingsRemoved: Carros eliminados
removeConfirmTitle: Las líneas seleccionadas serán eliminadas
removeConfirmSubtitle: ¿Seguro que quieres continuar?

10
src/router/modules/item.js
View File

@ -20,6 +20,7 @@ export default {
'ItemTax',
'ItemBotanical',
'ItemBarcode',
'ItemShelving',
],
},
children: [
@ -157,6 +158,15 @@ export default {
},
component: () => import('src/pages/Item/Card/ItemBotanical.vue'),
},
{
path: 'shelving',
name: 'ItemShelving',
meta: {
title: 'shelving',
icon: 'vn:inventory',
},
component: () => import('src/pages/Item/Card/ItemShelving.vue'),
},
],
},
],