From a8057b47dcde8623fa8b9902349884002a146409 Mon Sep 17 00:00:00 2001
From: Javier Segarra <jsegarra@verdnatura.es>
Date: Fri, 6 Sep 2024 14:06:30 +0200
Subject: [PATCH] feat: updates

---
 src/components/VnTable/VnTable.vue      |   1 -
 src/pages/Item/ItemFixedPrice.vue       | 111 ++++++++----------------
 src/pages/Item/ItemFixedPriceFilter.vue |  46 +++++-----
 3 files changed, 63 insertions(+), 95 deletions(-)

diff --git a/src/components/VnTable/VnTable.vue b/src/components/VnTable/VnTable.vue
index 20482c494..6745a2f49 100644
--- a/src/components/VnTable/VnTable.vue
+++ b/src/components/VnTable/VnTable.vue
@@ -373,7 +373,6 @@ function handleOnDataSaved(_, res) {
             <slot :name="slotName" v-bind="slotData ?? {}" :key="slotName" />
         </template>
         <template #body="{ rows }">
-            {{ rows }}
             <QTable
                 v-bind="table"
                 class="vnTable"
diff --git a/src/pages/Item/ItemFixedPrice.vue b/src/pages/Item/ItemFixedPrice.vue
index 2085e7665..e042cb859 100644
--- a/src/pages/Item/ItemFixedPrice.vue
+++ b/src/pages/Item/ItemFixedPrice.vue
@@ -2,7 +2,6 @@
 import { onMounted, ref, reactive, onUnmounted, nextTick, computed } from 'vue';
 import { useI18n } from 'vue-i18n';
 import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
-
 import FetchedTags from 'components/ui/FetchedTags.vue';
 import VnInput from 'src/components/common/VnInput.vue';
 import VnSelect from 'src/components/common/VnSelect.vue';
@@ -12,7 +11,8 @@ import ItemFixedPriceFilter from './ItemFixedPriceFilter.vue';
 import { useQuasar } from 'quasar';
 import ItemDescriptorProxy from './Card/ItemDescriptorProxy.vue';
 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 { toDate } from 'src/filters';
 import { useVnConfirm } from 'composables/useVnConfirm';
@@ -33,30 +33,13 @@ const { notify } = useNotify();
 const editTableCellDialogRef = ref(null);
 const user = state.getUser();
 const fixedPrices = ref([]);
-const fixedPricesOriginalData = ref([]);
 const warehousesOptions = 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 defaultColumnAttrs = {
-    align: 'right',
-    sortable: false,
+    align: 'left',
+    sortable: true,
 };
 
 const columns = computed(() => [
@@ -86,6 +69,16 @@ const columns = computed(() => [
         name: 'rate2',
         ...defaultColumnAttrs,
         cardVisible: true,
+        columnField: {
+            class: 'expand',
+            component: 'input',
+            type: 'number',
+        },
+        columnFilter: {
+            class: 'expand',
+            component: 'input',
+            type: 'number',
+        },
     },
     {
         label: t('item.fixedPrice.packingPrice'),
@@ -93,6 +86,16 @@ const columns = computed(() => [
         name: 'rate3',
         ...defaultColumnAttrs,
         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',
             type: 'number',
         },
+        columnFilter: {
+            class: 'expand',
+            component: 'input',
+            type: 'number',
+        },
     },
     {
         label: t('item.fixedPrice.started'),
@@ -119,6 +127,9 @@ const columns = computed(() => [
             component: 'date',
             class: 'shrink',
         },
+        columnFilter: {
+            component: 'date',
+        },
         columnClass: 'expand',
     },
     {
@@ -131,6 +142,9 @@ const columns = computed(() => [
             component: 'date',
             class: 'shrink',
         },
+        columnFilter: {
+            component: 'date',
+        },
         columnClass: 'expand',
         format: (row) => toDate(row.ended),
     },
@@ -175,20 +189,6 @@ const getRowUpdateInputEvents = (props, resetMinPrice, inputType = 'text') => {
         : { '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) => {
     // 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
@@ -246,33 +246,13 @@ function checkLastVisibleRow() {
     return lastVisibleRow;
 }
 const addRow = (original = null) => {
-    // const original = checkLastVisibleRow();
     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) {
         const today = Date.vnNew();
         const millisecsInDay = 86400000;
         const daysInWeek = 7;
         const nextWeek = new Date(today.getTime() + daysInWeek * millisecsInDay);
 
-        // lastItem.value = {
         copy = {
             id: 0,
             started: today,
@@ -280,8 +260,6 @@ const addRow = (original = null) => {
             hasMinPrice: 0,
             $index: 0,
         };
-
-        // return;
     } else
         copy = {
             $index: original.$index - 1,
@@ -302,17 +280,8 @@ const addRow = (original = null) => {
             started: 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 };
 };
-const lastItem = ref(null);
 function highlightNewRow({ $index: index }) {
     const row = document
         .getElementsByClassName('q-table')[0]
@@ -341,9 +310,6 @@ const removeFuturePrice = async () => {
     }
 };
 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) {
     quasar.dialog({
@@ -382,18 +348,17 @@ onMounted(async () => {
 });
 function handleOnDataSave({ CrudModelRef }) {
     const { original, copy } = addRow(CrudModelRef.formData[checkLastVisibleRow()]);
-    // CrudModelRef.formData.unshift(roww);
     if (original) {
         CrudModelRef.formData.splice(original?.$index ?? 0, 0, copy);
     } else {
         CrudModelRef.insert(copy);
-        // CrudModelRef.reload();
     }
     nextTick(() => {
         highlightNewRow(original ?? { $index: 0 });
     });
 }
 onUnmounted(() => (stateStore.rightDrawer = false));
+const itemFixedPriceFilterRef = ref();
 </script>
 
 <template>
@@ -407,7 +372,7 @@ onUnmounted(() => (stateStore.rightDrawer = false));
         <template #right-panel>
             <ItemFixedPriceFilter
                 data-key="ItemFixedPrices"
-                :warehouses-options="warehousesOptions"
+                ref="itemFixedPriceFilterRef"
             />
         </template>
     </RightMenu>
@@ -443,7 +408,7 @@ onUnmounted(() => (stateStore.rightDrawer = false));
             url="FixedPrices/filter"
             :order="['name ASC', 'itemFk DESC']"
             save-url="FixedPrices/crud"
-            :filter="{ where: { warehouseFk: user.warehouseFk } }"
+            :user-params="{ warehouseFk: user.warehouseFk }"
             ref="tableRef"
             dense
             :columns="columns"
diff --git a/src/pages/Item/ItemFixedPriceFilter.vue b/src/pages/Item/ItemFixedPriceFilter.vue
index f2e83ba3a..b9fdc57be 100644
--- a/src/pages/Item/ItemFixedPriceFilter.vue
+++ b/src/pages/Item/ItemFixedPriceFilter.vue
@@ -1,5 +1,5 @@
 <script setup>
-import { computed, onMounted, ref } from 'vue';
+import { ref } from 'vue';
 import { useI18n } from 'vue-i18n';
 
 import FetchData from 'components/FetchData.vue';
@@ -9,38 +9,36 @@ import ItemsFilterPanel from 'src/components/ItemsFilterPanel.vue';
 
 const { t } = useI18n();
 
-defineProps({
+const props = defineProps({
     dataKey: {
         type: String,
         required: true,
     },
 });
-import { useRoute } from 'vue-router';
-const route = useRoute();
 
 const itemTypeWorkersOptions = ref([]);
-// const sanitizeParam = (param) => {
-//     const params = JSON.parse(route?.query?.table);
-//     return params[param] ?? 'false';
-// };
 const $params = ref({});
-// onMounted(() => {
-//     ['mine', 'hasMinPrice', 'showBadDates'].forEach(
-//         (tag) => ($params.value[tag] = sanitizeParam(tag))
-//     );
-// });
 const pushParam = (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>
 
 <template>
-    <FetchData
-        @on-fetch="(data) => (warehousesOptions = data)"
-        auto-load
-        url="Warehouses"
-        :filter="{ fields: ['id', 'name'], order: 'name ASC', limit: 30 }"
-    />
     <FetchData
         url="TicketRequests/getItemTypeWorker"
         limit="30"
@@ -48,7 +46,11 @@ const pushParam = (param) => ({
         :filter="{ fields: ['id', 'nickname'], order: 'nickname ASC', limit: 30 }"
         @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 }">
             <QItem class="q-my-md">
                 <QItemSection>
@@ -69,9 +71,11 @@ const pushParam = (param) => ({
             <QItem class="q-my-md">
                 <QItemSection>
                     <VnSelect
+                        url="Warehouses"
+                        auto-load
+                        :filter="{ fields: ['id', 'name'], order: 'name ASC', limit: 30 }"
                         :label="t('components.itemsFilterPanel.warehouseFk')"
                         v-model="params.warehouseFk"
-                        :options="warehousesOptions"
                         option-label="name"
                         option-value="id"
                         dense