0
0
Fork 0

feat: updates

This commit is contained in:
Javier Segarra 2024-09-06 14:06:30 +02:00
parent 9bb298bbeb
commit a8057b47dc
3 changed files with 63 additions and 95 deletions

View File

@ -373,7 +373,6 @@ function handleOnDataSaved(_, res) {
<slot :name="slotName" v-bind="slotData ?? {}" :key="slotName" /> <slot :name="slotName" v-bind="slotData ?? {}" :key="slotName" />
</template> </template>
<template #body="{ rows }"> <template #body="{ rows }">
{{ rows }}
<QTable <QTable
v-bind="table" v-bind="table"
class="vnTable" class="vnTable"

View File

@ -2,7 +2,6 @@
import { onMounted, ref, reactive, onUnmounted, nextTick, computed } from 'vue'; import { onMounted, ref, reactive, onUnmounted, nextTick, computed } from 'vue';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue'; import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
import FetchedTags from 'components/ui/FetchedTags.vue'; import FetchedTags from 'components/ui/FetchedTags.vue';
import VnInput from 'src/components/common/VnInput.vue'; import VnInput from 'src/components/common/VnInput.vue';
import VnSelect from 'src/components/common/VnSelect.vue'; import VnSelect from 'src/components/common/VnSelect.vue';
@ -12,7 +11,8 @@ import ItemFixedPriceFilter from './ItemFixedPriceFilter.vue';
import { useQuasar } from 'quasar'; import { useQuasar } from 'quasar';
import ItemDescriptorProxy from './Card/ItemDescriptorProxy.vue'; import ItemDescriptorProxy from './Card/ItemDescriptorProxy.vue';
import { tMobile } from 'src/composables/tMobile'; import { tMobile } from 'src/composables/tMobile';
import VnConfirm from 'components/ui/VnConfirm.vue';
import FetchData from 'src/components/FetchData.vue';
import { useStateStore } from 'stores/useStateStore'; import { useStateStore } from 'stores/useStateStore';
import { toDate } from 'src/filters'; import { toDate } from 'src/filters';
import { useVnConfirm } from 'composables/useVnConfirm'; import { useVnConfirm } from 'composables/useVnConfirm';
@ -33,30 +33,13 @@ const { notify } = useNotify();
const editTableCellDialogRef = ref(null); const editTableCellDialogRef = ref(null);
const user = state.getUser(); const user = state.getUser();
const fixedPrices = ref([]); const fixedPrices = ref([]);
const fixedPricesOriginalData = ref([]);
const warehousesOptions = ref([]); const warehousesOptions = ref([]);
const rowsSelected = ref([]); const rowsSelected = ref([]);
const exprBuilder = (param, value) => {
switch (param) {
case 'name':
return { 'i.name': { like: `%${value}%` } };
case 'itemFk':
case 'warehouseFk':
case 'rate2':
case 'rate3':
param = `fp.${param}`;
return { [param]: value };
case 'minPrice':
param = `i.${param}`;
return { [param]: value };
}
};
const params = reactive({}); const params = reactive({});
const defaultColumnAttrs = { const defaultColumnAttrs = {
align: 'right', align: 'left',
sortable: false, sortable: true,
}; };
const columns = computed(() => [ const columns = computed(() => [
@ -86,6 +69,16 @@ const columns = computed(() => [
name: 'rate2', name: 'rate2',
...defaultColumnAttrs, ...defaultColumnAttrs,
cardVisible: true, cardVisible: true,
columnField: {
class: 'expand',
component: 'input',
type: 'number',
},
columnFilter: {
class: 'expand',
component: 'input',
type: 'number',
},
}, },
{ {
label: t('item.fixedPrice.packingPrice'), label: t('item.fixedPrice.packingPrice'),
@ -93,6 +86,16 @@ const columns = computed(() => [
name: 'rate3', name: 'rate3',
...defaultColumnAttrs, ...defaultColumnAttrs,
cardVisible: true, cardVisible: true,
columnField: {
class: 'expand',
component: 'input',
type: 'number',
},
columnFilter: {
class: 'expand',
component: 'input',
type: 'number',
},
}, },
{ {
@ -107,6 +110,11 @@ const columns = computed(() => [
component: 'input', component: 'input',
type: 'number', type: 'number',
}, },
columnFilter: {
class: 'expand',
component: 'input',
type: 'number',
},
}, },
{ {
label: t('item.fixedPrice.started'), label: t('item.fixedPrice.started'),
@ -119,6 +127,9 @@ const columns = computed(() => [
component: 'date', component: 'date',
class: 'shrink', class: 'shrink',
}, },
columnFilter: {
component: 'date',
},
columnClass: 'expand', columnClass: 'expand',
}, },
{ {
@ -131,6 +142,9 @@ const columns = computed(() => [
component: 'date', component: 'date',
class: 'shrink', class: 'shrink',
}, },
columnFilter: {
component: 'date',
},
columnClass: 'expand', columnClass: 'expand',
format: (row) => toDate(row.ended), format: (row) => toDate(row.ended),
}, },
@ -175,20 +189,6 @@ const getRowUpdateInputEvents = (props, resetMinPrice, inputType = 'text') => {
: { 'update:modelValue': () => upsertPrice(props, resetMinPrice) }; : { 'update:modelValue': () => upsertPrice(props, resetMinPrice) };
}; };
const validations = (row, rowIndex, col) => {
const isNew = !row.id;
// Si la row no tiene id significa que fue agregada con addRow y no se ha guardado en la base de datos
// Si isNew es falso no se checkea si el valor es igual a la original
if (!isNew)
// if (fixedPricesOriginalData.value[rowIndex][col.field] == row[col.field])
return false;
const requiredFields = ['itemFk', 'started', 'ended', 'rate2', 'rate3'];
return requiredFields.every(
(field) => row[field] !== null && row[field] !== undefined
);
};
const updateMinPrice = async (value, props) => { const updateMinPrice = async (value, props) => {
// El checkbox hasMinPrice se encuentra en la misma columna que el input hasMinPrice // El checkbox hasMinPrice se encuentra en la misma columna que el input hasMinPrice
// Por lo tanto le mandamos otro objeto con las mismas propiedades pero con el campo 'field' cambiado // Por lo tanto le mandamos otro objeto con las mismas propiedades pero con el campo 'field' cambiado
@ -246,33 +246,13 @@ function checkLastVisibleRow() {
return lastVisibleRow; return lastVisibleRow;
} }
const addRow = (original = null) => { const addRow = (original = null) => {
// const original = checkLastVisibleRow();
let copy = null; let copy = null;
// if (!fixedPrices.value || fixedPrices.value.length === 0) {
// fixedPrices.value = [];
// const today = Date.vnNew();
// const millisecsInDay = 86400000;
// const daysInWeek = 7;
// const nextWeek = new Date(today.getTime() + daysInWeek * millisecsInDay);
// const newPrice = {
// started: today,
// ended: nextWeek,
// hasMinPrice: 0,
// };
// fixedPricesOriginalData.value.push({ ...newPrice });
// fixedPrices.value.push({ ...newPrice });
// return;
// }
if (!original) { if (!original) {
const today = Date.vnNew(); const today = Date.vnNew();
const millisecsInDay = 86400000; const millisecsInDay = 86400000;
const daysInWeek = 7; const daysInWeek = 7;
const nextWeek = new Date(today.getTime() + daysInWeek * millisecsInDay); const nextWeek = new Date(today.getTime() + daysInWeek * millisecsInDay);
// lastItem.value = {
copy = { copy = {
id: 0, id: 0,
started: today, started: today,
@ -280,8 +260,6 @@ const addRow = (original = null) => {
hasMinPrice: 0, hasMinPrice: 0,
$index: 0, $index: 0,
}; };
// return;
} else } else
copy = { copy = {
$index: original.$index - 1, $index: original.$index - 1,
@ -302,17 +280,8 @@ const addRow = (original = null) => {
started: Date.vnNew(), started: Date.vnNew(),
ended: Date.vnNew(), ended: Date.vnNew(),
}; };
// lastItem.value = lastItemCopy;
// tableRef.value.create.onDataSaved(lastItem);
// nextTick(() => {
// highlightNewRow(fixedPrice);
// });
// delete lastItemCopy.id;
// fixedPricesOriginalData.value.splice(lastvisible, 0, lastItemCopy);
// fixedPrices.value.unshift(lastItemCopy);
return { original, copy }; return { original, copy };
}; };
const lastItem = ref(null);
function highlightNewRow({ $index: index }) { function highlightNewRow({ $index: index }) {
const row = document const row = document
.getElementsByClassName('q-table')[0] .getElementsByClassName('q-table')[0]
@ -341,9 +310,6 @@ const removeFuturePrice = async () => {
} }
}; };
const quasar = useQuasar(); const quasar = useQuasar();
import VnConfirm from 'components/ui/VnConfirm.vue';
import FetchData from 'src/components/FetchData.vue';
import CrudModel from 'src/components/CrudModel.vue';
function confirmRemove(item) { function confirmRemove(item) {
quasar.dialog({ quasar.dialog({
@ -382,18 +348,17 @@ onMounted(async () => {
}); });
function handleOnDataSave({ CrudModelRef }) { function handleOnDataSave({ CrudModelRef }) {
const { original, copy } = addRow(CrudModelRef.formData[checkLastVisibleRow()]); const { original, copy } = addRow(CrudModelRef.formData[checkLastVisibleRow()]);
// CrudModelRef.formData.unshift(roww);
if (original) { if (original) {
CrudModelRef.formData.splice(original?.$index ?? 0, 0, copy); CrudModelRef.formData.splice(original?.$index ?? 0, 0, copy);
} else { } else {
CrudModelRef.insert(copy); CrudModelRef.insert(copy);
// CrudModelRef.reload();
} }
nextTick(() => { nextTick(() => {
highlightNewRow(original ?? { $index: 0 }); highlightNewRow(original ?? { $index: 0 });
}); });
} }
onUnmounted(() => (stateStore.rightDrawer = false)); onUnmounted(() => (stateStore.rightDrawer = false));
const itemFixedPriceFilterRef = ref();
</script> </script>
<template> <template>
@ -407,7 +372,7 @@ onUnmounted(() => (stateStore.rightDrawer = false));
<template #right-panel> <template #right-panel>
<ItemFixedPriceFilter <ItemFixedPriceFilter
data-key="ItemFixedPrices" data-key="ItemFixedPrices"
:warehouses-options="warehousesOptions" ref="itemFixedPriceFilterRef"
/> />
</template> </template>
</RightMenu> </RightMenu>
@ -443,7 +408,7 @@ onUnmounted(() => (stateStore.rightDrawer = false));
url="FixedPrices/filter" url="FixedPrices/filter"
:order="['name ASC', 'itemFk DESC']" :order="['name ASC', 'itemFk DESC']"
save-url="FixedPrices/crud" save-url="FixedPrices/crud"
:filter="{ where: { warehouseFk: user.warehouseFk } }" :user-params="{ warehouseFk: user.warehouseFk }"
ref="tableRef" ref="tableRef"
dense dense
:columns="columns" :columns="columns"

View File

@ -1,5 +1,5 @@
<script setup> <script setup>
import { computed, onMounted, ref } from 'vue'; import { ref } from 'vue';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import FetchData from 'components/FetchData.vue'; import FetchData from 'components/FetchData.vue';
@ -9,38 +9,36 @@ import ItemsFilterPanel from 'src/components/ItemsFilterPanel.vue';
const { t } = useI18n(); const { t } = useI18n();
defineProps({ const props = defineProps({
dataKey: { dataKey: {
type: String, type: String,
required: true, required: true,
}, },
}); });
import { useRoute } from 'vue-router';
const route = useRoute();
const itemTypeWorkersOptions = ref([]); const itemTypeWorkersOptions = ref([]);
// const sanitizeParam = (param) => {
// const params = JSON.parse(route?.query?.table);
// return params[param] ?? 'false';
// };
const $params = ref({}); const $params = ref({});
// onMounted(() => {
// ['mine', 'hasMinPrice', 'showBadDates'].forEach(
// (tag) => ($params.value[tag] = sanitizeParam(tag))
// );
// });
const pushParam = (param) => ({ const pushParam = (param) => ({
param: { [param]: $params.value[param] }, param: { [param]: $params.value[param] },
}); });
const exprBuilder = (param, value) => {
switch (param) {
case 'name':
return { 'i.name': { like: `%${value}%` } };
case 'itemFk':
case 'warehouseFk':
case 'rate2':
case 'rate3':
param = `fp.${param}`;
return { [param]: value };
case 'minPrice':
param = `i.${param}`;
return { [param]: value };
}
};
</script> </script>
<template> <template>
<FetchData
@on-fetch="(data) => (warehousesOptions = data)"
auto-load
url="Warehouses"
:filter="{ fields: ['id', 'name'], order: 'name ASC', limit: 30 }"
/>
<FetchData <FetchData
url="TicketRequests/getItemTypeWorker" url="TicketRequests/getItemTypeWorker"
limit="30" limit="30"
@ -48,7 +46,11 @@ const pushParam = (param) => ({
:filter="{ fields: ['id', 'nickname'], order: 'nickname ASC', limit: 30 }" :filter="{ fields: ['id', 'nickname'], order: 'nickname ASC', limit: 30 }"
@on-fetch="(data) => (itemTypeWorkersOptions = data)" @on-fetch="(data) => (itemTypeWorkersOptions = data)"
/> />
<ItemsFilterPanel :data-key="dataKey" :custom-tags="['tags']"> <ItemsFilterPanel
:data-key="props.dataKey"
:custom-tags="['tags']"
search-url="table"
>
<template #body="{ params, searchFn }"> <template #body="{ params, searchFn }">
<QItem class="q-my-md"> <QItem class="q-my-md">
<QItemSection> <QItemSection>
@ -69,9 +71,11 @@ const pushParam = (param) => ({
<QItem class="q-my-md"> <QItem class="q-my-md">
<QItemSection> <QItemSection>
<VnSelect <VnSelect
url="Warehouses"
auto-load
:filter="{ fields: ['id', 'name'], order: 'name ASC', limit: 30 }"
:label="t('components.itemsFilterPanel.warehouseFk')" :label="t('components.itemsFilterPanel.warehouseFk')"
v-model="params.warehouseFk" v-model="params.warehouseFk"
:options="warehousesOptions"
option-label="name" option-label="name"
option-value="id" option-value="id"
dense dense