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

WIP

This commit is contained in:
William Buezas 2024-04-16 08:21:44 -03:00
parent 00dfa171b0
commit 5664ec1313
3 changed files with 153 additions and 182 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -1128,6 +1128,11 @@ item:
fixedPrice:
itemId: Item ID
groupingPrice: Grouping price
packingPrice: Packing price
minPrice: Min price
started: Started
ended: Ended
warehouse: Warehouse
components:
topbar: {}
userPanel:

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

@ -1125,6 +1125,11 @@ item:
fixedPrice:
itemId: ID Artículo
groupingPrice: Precio grouping
packingPrice: Precio packing
minPrice: Precio min
started: Inicio
ended: Fin
warehouse: Almacén
components:
topbar: {}
userPanel:

325
src/pages/Item/ItemFixedPrice.vue
View File

@ -5,11 +5,11 @@ import { useRouter } from 'vue-router';
import FetchData from 'components/FetchData.vue';
import FetchedTags from 'components/ui/FetchedTags.vue';
import TableVisibleColumns from 'src/components/common/TableVisibleColumns.vue';
import VnInput from 'src/components/common/VnInput.vue';
import VnSelectFilter from 'src/components/common/VnSelectFilter.vue';
import ItemDescriptorProxy from '../Item/Card/ItemDescriptorProxy.vue';
import WorkerDescriptorProxy from 'src/pages/Worker/Card/WorkerDescriptorProxy.vue';
import VnInputDate from 'src/components/common/VnInputDate.vue';
import { useStateStore } from 'stores/useStateStore';
import { toDateFormat } from 'src/filters/date.js';
@ -18,6 +18,7 @@ import { dashIfEmpty } from 'src/filters';
import { useVnConfirm } from 'composables/useVnConfirm';
import { useState } from 'src/composables/useState';
import { toCurrency } from 'filters/index';
import useNotify from 'src/composables/useNotify.js';
import axios from 'axios';
const router = useRouter();
@ -27,10 +28,12 @@ const stateStore = useStateStore();
const { t } = useI18n();
const { openConfirmationModal } = useVnConfirm();
const state = useState();
const { notify } = useNotify();
const paginateRef = ref(null);
const user = state.getUser();
const fixedPrices = ref([]);
const fixedPricesOriginalData = ref([]);
const warehousesOptions = ref([]);
const itemsWithNameOptions = ref([]);
@ -77,37 +80,18 @@ const applyColumnFilter = async (col) => {
}
};
const getInputEvents = (col) => {
return col.columnFilter.type === 'select'
? { 'update:modelValue': () => applyColumnFilter(col) }
: {
'keyup.enter': () => applyColumnFilter(col),
};
};
const upsertPrice = (price, resetMinPrice) => {
// if (resetMinPrice) delete price['minPrice'];
// const requiredFields = ['itemFk', 'started', 'ended', 'rate2', 'rate3'];
// for (const field of requiredFields) if (price[field] == undefined) return;
// const query = 'FixedPrices/upsertFixedPrice';
// this.$http.patch(query, price).then((res) => {
// this.vnApp.showSuccess(this.$t('Data saved!'));
// Object.assign(price, res.data);
// });
};
const columns = computed(() => [
{
label: t('item.fixedPrice.itemId'),
name: 'itemId',
// field: 'id',
field: 'itemFk',
align: 'left',
sortable: true,
// columnFilter: {
// component: VnInput,
// type: 'text',
// filterValue: null,
// event: getInputEvents,
// event: getColumnInputEvents,
// attrs: {
// dense: true,
// },
@ -123,7 +107,7 @@ const columns = computed(() => [
// component: VnInput,
// type: 'text',
// filterValue: null,
// event: getInputEvents,
// event: getColumnInputEvents,
// attrs: {
// dense: true,
// },
@ -139,7 +123,7 @@ const columns = computed(() => [
// component: VnInput,
// type: 'text',
// filterValue: null,
// event: getInputEvents,
// event: getColumnInputEvents,
// attrs: {
// dense: true,
// },
@ -147,16 +131,16 @@ const columns = computed(() => [
format: (val) => toCurrency(val),
},
{
label: t('item.list.packing'),
field: 'packing',
name: 'packing',
label: t('item.fixedPrice.packingPrice'),
field: 'rate3',
name: 'packingPrice',
align: 'left',
sortable: true,
// columnFilter: {
// component: VnInput,
// type: 'text',
// filterValue: null,
// event: getInputEvents,
// event: getColumnInputEvents,
// attrs: {
// dense: true,
// },
@ -165,41 +149,41 @@ const columns = computed(() => [
},
{
label: t('item.list.stems'),
field: 'stems',
name: 'stems',
label: t('item.fixedPrice.minPrice'),
field: 'minPrice',
name: 'minPrice',
align: 'left',
sortable: true,
// columnFilter: {
// component: VnInput,
// type: 'text',
// filterValue: null,
// event: getInputEvents,
// event: getColumnInputEvents,
// attrs: {
// dense: true,
// },
// },
},
{
label: t('item.list.size'),
field: 'size',
name: 'size',
label: t('item.fixedPrice.started'),
field: 'started',
name: 'started',
align: 'left',
sortable: true,
// columnFilter: {
// component: VnInput,
// type: 'text',
// filterValue: null,
// event: getInputEvents,
// event: getColumnInputEvents,
// attrs: {
// dense: true,
// },
// },
},
{
label: t('item.list.typeName'),
field: 'typeName',
name: 'typeName',
label: t('item.fixedPrice.ended'),
field: 'ended',
name: 'ended',
align: 'left',
sortable: true,
// columnFilter: {
@ -207,7 +191,7 @@ const columns = computed(() => [
// filterParamKey: 'typeFk',
// type: 'select',
// filterValue: null,
// event: getInputEvents,
// event: getColumnInputEvents,
// attrs: {
// options: itemTypesOptions.value,
// 'option-value': 'id',
@ -218,16 +202,16 @@ const columns = computed(() => [
},
{
label: t('item.list.category'),
field: 'category',
name: 'category',
label: t('item.fixedPrice.warehouse'),
field: 'warehouse',
name: 'warehouse',
align: 'left',
sortable: true,
// columnFilter: {
// component: VnSelectFilter,
// type: 'select',
// filterValue: null,
// event: getInputEvents,
// event: getColumnInputEvents,
// attrs: {
// options: itemCategoriesOptions.value,
// 'option-value': 'name',
@ -236,141 +220,14 @@ const columns = computed(() => [
// },
// },
},
{
label: t('item.list.intrastat'),
field: 'intrastat',
name: 'intrastat',
align: 'left',
sortable: true,
// columnFilter: {
// component: VnSelectFilter,
// type: 'select',
// filterValue: null,
// event: getInputEvents,
// attrs: {
// options: intrastatOptions.value,
// 'option-value': 'description',
// 'option-label': 'description',
// dense: true,
// },
// },
},
{
label: t('item.list.origin'),
field: 'origin',
name: 'origin',
align: 'left',
sortable: true,
// columnFilter: {
// component: VnSelectFilter,
// type: 'select',
// filterValue: null,
// event: getInputEvents,
// attrs: {
// options: originsOptions.value,
// 'option-value': 'code',
// 'option-label': 'code',
// dense: true,
// },
// },
},
{
label: t('item.list.userName'),
field: 'userName',
name: 'userName',
align: 'left',
sortable: true,
// columnFilter: {
// component: VnSelectFilter,
// filterParamKey: 'buyerFk',
// type: 'select',
// filterValue: null,
// event: getInputEvents,
// attrs: {
// options: buyersOptions.value,
// 'option-value': 'id',
// 'option-label': 'nickname',
// dense: true,
// },
// },
},
{
label: t('item.list.weightByPiece'),
field: 'weightByPiece',
name: 'weightByPiece',
align: 'left',
sortable: true,
// columnFilter: {
// component: VnInput,
// type: 'text',
// filterValue: null,
// event: getInputEvents,
// attrs: {
// dense: true,
// },
// },
format: (val) => dashIfEmpty(val),
},
{
label: t('item.list.stemMultiplier'),
field: 'stemMultiplier',
name: 'stemMultiplier',
align: 'left',
sortable: true,
// columnFilter: {
// component: VnInput,
// type: 'text',
// filterValue: null,
// event: getInputEvents,
// attrs: {
// dense: true,
// },
// },
format: (val) => dashIfEmpty(val),
},
{
label: t('item.list.isActive'),
field: 'isActive',
name: 'isActive',
align: 'left',
sortable: true,
// columnFilter: null,
},
{
label: t('item.list.producer'),
field: 'producer',
name: 'producer',
align: 'left',
sortable: true,
// columnFilter: {
// component: VnInput,
// type: 'text',
// filterValue: null,
// event: getInputEvents,
// attrs: {
// dense: true,
// },
// },
format: (val) => dashIfEmpty(val),
},
{
label: t('item.list.landed'),
field: 'landed',
name: 'landed',
align: 'left',
sortable: true,
format: (val) => dashIfEmpty(toDateFormat(val)),
// columnFilter: null,
},
{
label: '',
name: 'actions',
align: 'left',
// columnFilter: null,
},
]);
const onFixedPricesFetched = (data) => {
fixedPrices.value = data;
// el objetivo de esto es guardar los valores iniciales de todas las rows para evitar guardar cambios si la data no cambió al disparar los eventos
fixedPricesOriginalData.value = JSON.parse(JSON.stringify(data));
};
const redirectToItemCreate = () => {
router.push({ name: 'ItemCreate' });
};
@ -389,6 +246,43 @@ const cloneItem = async (itemFk) => {
// }
};
const getRowUpdateInputEvents = (props, resetMinPrice, inputType = 'text') => {
return inputType === 'text'
? {
'keyup.enter': () => upsertPrice(props, resetMinPrice),
blur: () => upsertPrice(props, resetMinPrice),
}
: { 'update:modelValue': () => upsertPrice(props, resetMinPrice) };
};
const getColumnInputEvents = (col) => {
return col.columnFilter.type === 'select'
? { 'update:modelValue': () => applyColumnFilter(col) }
: {
'keyup.enter': () => applyColumnFilter(col),
};
};
const upsertPrice = async ({ row, col, rowIndex }, resetMinPrice) => {
console.log('row', row);
console.log('col', col);
console.log('rowIndex', rowIndex);
console.log('field', col.field);
console.log('originalData: ', fixedPricesOriginalData.value[rowIndex][col.field]);
console.log('actual value: ', row[col.field]);
if (fixedPricesOriginalData.value[rowIndex][col.field] == row[col.field]) return;
try {
if (resetMinPrice) row.hasMinPrice = 0;
const requiredFields = ['itemFk', 'started', 'ended', 'rate2', 'rate3'];
for (const field of requiredFields) if (!row[field]) return;
const { data } = await axios.patch('FixedPrices/upsertFixedPrice', row);
row = data;
fixedPricesOriginalData.value[rowIndex][col.field] = row[col.field];
} catch (err) {
console.error('Error upserting price', err);
}
};
onMounted(async () => {
stateStore.rightDrawer = true;
});
@ -402,7 +296,7 @@ onUnmounted(() => (stateStore.rightDrawer = false));
:filter="{ order: ['itemFk'] }"
:params="{ warehouseFk: user.warehouseFk }"
auto-load
@on-fetch="(data) => (fixedPrices = data)"
@on-fetch="(data) => onFixedPricesFetched(data)"
/>
<FetchData
url="Warehouses"
@ -424,7 +318,6 @@ onUnmounted(() => (stateStore.rightDrawer = false));
:pagination="{ rowsPerPage: 0 }"
class="full-width q-mt-md"
:no-data-label="t('globals.noResults')"
@row-click="(_, row) => redirectToItemSummary(row.id)"
>
<!-- <template #top-row="{ cols }">
<QTr>
@ -445,15 +338,15 @@ onUnmounted(() => (stateStore.rightDrawer = false));
</QTr>
</template> -->
<template #body-cell-itemId="{ row }">
<template #body-cell-itemId="props">
<QTd>
<VnSelectFilter
:options="itemsWithNameOptions"
hide-selected
option-label="id"
option-value="id"
v-model="row.itemFk"
@update:model-value="upsertPrice(row, true)"
v-model="props.row.itemFk"
v-on="getRowUpdateInputEvents(props, true, 'select')"
>
<template #option="scope">
<QItem v-bind="scope.itemProps">
@ -472,6 +365,74 @@ onUnmounted(() => (stateStore.rightDrawer = false));
<fetched-tags :item="row" :max-length="6" />
</QTd>
</template>
<template #body-cell-groupingPrice="props">
<QTd class="col">
<VnInput
v-model.number="props.row.rate2"
v-on="getRowUpdateInputEvents(props)"
>
<template #append>€</template>
</VnInput>
</QTd>
</template>
<template #body-cell-packingPrice="props">
<QTd class="col">
<VnInput
v-model.number="props.row.rate3"
v-on="getRowUpdateInputEvents(props)"
>
<template #append>€</template>
</VnInput>
</QTd>
</template>
<template #body-cell-minPrice="props">
<QTd class="col">
<div class="row">
<QCheckbox
class="col"
v-model="props.row.hasMinPrice"
:false-value="0"
:true-value="1"
v-on="getRowUpdateInputEvents(props)"
/>
<VnInput
class="col"
:disable="!props.row.hasMinPrice"
v-model.number="props.row.minPrice"
v-on="getRowUpdateInputEvents(props)"
type="number"
/>
</div>
</QTd>
</template>
<template #body-cell-started="props">
<QTd class="col" style="min-width: 150px">
<VnInputDate
v-model="props.row.started"
v-on="getRowUpdateInputEvents(props)"
/>
</QTd>
</template>
<template #body-cell-ended="props">
<QTd class="col" style="min-width: 150px">
<VnInputDate
v-model="props.row.ended"
v-on="getRowUpdateInputEvents(props)"
/>
</QTd>
</template>
<template #body-cell-warehouse="props">
<QTd class="col">
<VnSelectFilter
:options="warehousesOptions"
hide-selected
option-label="name"
option-value="id"
v-model="props.row.warehouseFk"
v-on="getRowUpdateInputEvents(props)"
/>
</QTd>
</template>
</QTable>
<QPageSticky :offset="[20, 20]">
<QBtn @click="redirectToItemCreate()" color="primary" fab icon="add" />