Item Fixed prices #307
|
|
@ -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:
|
||||
|
|
|
|||
|
|
@ -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:
|
||||
|
|
|
|||
|
|
@ -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')"
|
||||
|
jsegarra marked this conversation as resolved
|
||||
@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" />
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Mismo objeto
Cambiado
Commit:
dce48b536d