Merge pull request 'ItemFixedPrice' (!791) from hotfix_itemFixedPrice into master

Reviewed-on: verdnatura/salix-front#791
Reviewed-by: Carlos Satorres <carlossa@verdnatura.es>

src/components/CrudModel.vue

@@ -249,7 +249,7 @@ function getChanges() {
     for (const [i, row] of formData.value.entries()) {
         if (!row[pk]) {
             creates.push(row);
-        } else if (originalData.value) {
+        } else if (originalData.value[i]) {
             const data = getDifferences(originalData.value[i], row);
             if (!isEmpty(data)) {
                 updates.push({

src/components/EditTableCellValueForm.vue

@@ -85,12 +85,14 @@ const closeForm = () => {
                     hide-selected
                     option-label="label"
                     v-model="selectedField"
+                    data-cy="field-to-edit"
                 />
                 <component
                     :is="inputs[selectedField?.component || 'input']"
                     v-bind="selectedField?.attrs || {}"
                     v-model="newValue"
                     :label="t('Value')"
+                    data-cy="value-to-edit"
                     style="width: 200px"
                 />
             </VnRow>

src/components/ItemsFilterPanel.vue

@@ -9,6 +9,8 @@ import VnSelect from 'components/common/VnSelect.vue';
 import VnFilterPanelChip from 'components/ui/VnFilterPanelChip.vue';
 
 import axios from 'axios';
+import { getParamWhere } from 'src/filters';
+import { useRoute } from 'vue-router';
 
 const { t } = useI18n();
 const props = defineProps({
@@ -26,28 +28,21 @@ const props = defineProps({
     },
 });
 
-const itemCategories = ref([]);
+const route = useRoute();
-const selectedCategoryFk = ref(null);
+
-const selectedTypeFk = ref(null);
 const itemTypesOptions = ref([]);
 const suppliersOptions = ref([]);
 const tagOptions = ref([]);
 const tagValues = ref([]);
+const categoryList = ref(null);
+const selectedCategoryFk = ref(getParamWhere(route.query.table, 'categoryFk', false));
+const selectedTypeFk = ref(getParamWhere(route.query.table, 'typeFk', false));
 
-const categoryList = computed(() => {
+const selectedCategory = computed(() => {
-    return (itemCategories.value || [])
+    return (categoryList.value || []).find(
-        .filter((category) => category.display)
-        .map((category) => ({
-            ...category,
-            icon: `vn:${(category.icon || '').split('-')[1]}`,
-        }));
-});
-
-const selectedCategory = computed(() =>
-    (itemCategories.value || []).find(
         (category) => category?.id === selectedCategoryFk.value
-    )
+    );
-);
+});
 
 const selectedType = computed(() => {
     return (itemTypesOptions.value || []).find(
@@ -87,7 +82,7 @@ const applyTags = (params, search) => {
     search();
 };
 
-const fetchItemTypes = async (id) => {
+const fetchItemTypes = async (id = selectedCategoryFk.value) => {
     const filter = {
         fields: ['id', 'name', 'categoryFk'],
         where: { categoryFk: id },
@@ -126,15 +121,19 @@ const removeTag = (index, params, search) => {
     (tagValues.value || []).splice(index, 1);
     applyTags(params, search);
 };
+const setCategoryList = (data) => {
+    categoryList.value = (data || [])
+        .filter((category) => category.display)
+        .map((category) => ({
+            ...category,
+            icon: `vn:${(category.icon || '').split('-')[1]}`,
+        }));
+    fetchItemTypes();
+};
 </script>
 
 <template>
-    <FetchData
+    <FetchData url="ItemCategories" limit="30" auto-load @on-fetch="setCategoryList" />
-        url="ItemCategories"
-        limit="30"
-        auto-load
-        @on-fetch="(data) => (itemCategories = data)"
-    />
     <FetchData
         url="Suppliers"
         limit="30"

src/components/ui/VnNotes.vue

@@ -6,7 +6,6 @@ import { useI18n } from 'vue-i18n';
 import { useQuasar } from 'quasar';
 
 import { toDateHourMin } from 'src/filters';
-import { useState } from 'src/composables/useState';
 
 import VnPaginate from 'components/ui/VnPaginate.vue';
 import VnUserLink from 'components/ui/VnUserLink.vue';
@@ -26,9 +25,7 @@ const $props = defineProps({
 });
 
 const { t } = useI18n();
-const state = useState();
 const quasar = useQuasar();
-const currentUser = ref(state.getUser());
 const newNote = reactive({ text: null, observationTypeFk: null });
 const observationTypes = ref([]);
 const vnPaginateRef = ref();

src/filters/getParamWhere.js

@@ -1,4 +1,3 @@
-// parsing JSON safely
 function parseJSON(str, fallback) {
     try {
         return JSON.parse(str ?? '{}');

src/pages/Customer/Card/CustomerSummary.vue

@@ -1,12 +1,11 @@
 <script setup>
-import { computed, ref, onMounted } from 'vue';
+import { computed, ref } from 'vue';
 import { useRoute } from 'vue-router';
 import { useI18n } from 'vue-i18n';
 import VnUserLink from 'src/components/ui/VnUserLink.vue';
 
 import { toCurrency, toPercentage, toDate, dashOrCurrency } from 'src/filters';
 import CardSummary from 'components/ui/CardSummary.vue';
-import { getUrl } from 'src/composables/getUrl';
 import VnLv from 'src/components/ui/VnLv.vue';
 import VnLinkPhone from 'src/components/ui/VnLinkPhone.vue';
 import VnLinkMail from 'src/components/ui/VnLinkMail.vue';

src/pages/Item/Card/ItemBotanical.vue

@@ -1,5 +1,5 @@
 <script setup>
-import { ref, onMounted, reactive, computed } from 'vue';
+import { ref, reactive, computed } from 'vue';
 import { useRoute } from 'vue-router';
 import { useI18n } from 'vue-i18n';
 

src/pages/Item/ItemFixedPrice.vue

@@ -1,5 +1,5 @@
 <script setup>
-import { onMounted, ref, reactive, onUnmounted, nextTick, computed } from 'vue';
+import { onMounted, ref, 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';
@@ -37,11 +37,9 @@ const fixedPrices = ref([]);
 const warehousesOptions = ref([]);
 const rowsSelected = ref([]);
 const itemFixedPriceFilterRef = ref();
-const params = reactive({});
 
 onMounted(async () => {
     stateStore.rightDrawer = true;
-    params.warehouseFk = user.value.warehouseFk;
 });
 onUnmounted(() => (stateStore.rightDrawer = false));
 
@@ -137,8 +135,17 @@ const columns = computed(() => [
         ...defaultColumnAttrs,
         columnClass: 'shrink',
         component: 'select',
-
         options: warehousesOptions,
+        columnFilter: {
+            name: 'warehouseFk',
+            inWhere: true,
+            component: 'select',
+            attrs: {
+                options: warehousesOptions,
+                'option-label': 'name',
+                'option-value': 'id',
+            },
+        },
     },
     {
         align: 'right',
@@ -210,8 +217,6 @@ const getRowUpdateInputEvents = (props, resetMinPrice, inputType = 'text') => {
 };
 
 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
     props.row.hasMinPrice = value;
     await upsertPrice({
         row: props.row,
@@ -220,12 +225,33 @@ const updateMinPrice = async (value, props) => {
     });
 };
 
+const validations = ({ row }) => {
+    const requiredFields = [
+        'itemFk',
+        'started',
+        'ended',
+        'rate2',
+        'rate3',
+        'warehouseFk',
+    ];
+    const isValid = requiredFields.every(
+        (field) => row[field] !== null && row[field] !== undefined
+    );
+    return isValid;
+};
 const upsertPrice = async (props, resetMinPrice = false) => {
-    const { row } = props;
+    const isValid = validations({ ...props });
-    if (tableRef.value.CrudModelRef.getChanges().updates.length > 0) {
+    if (!isValid) {
-        if (resetMinPrice) row.hasMinPrice = 0;
+        return;
-        await upsertFixedPrice(row);
     }
+    const { row } = props;
+    const changes = tableRef.value.CrudModelRef.getChanges();
+    if (changes?.updates?.length > 0) {
+        if (resetMinPrice) row.hasMinPrice = 0;
+    }
+    if (!changes.updates && !changes.creates) return;
+    const data = await upsertFixedPrice(row);
+    tableRef.value.CrudModelRef.formData[props.rowIndex] = data;
 };
 
 async function upsertFixedPrice(row) {
@@ -233,13 +259,6 @@ async function upsertFixedPrice(row) {
     return data;
 }
 
-async function saveOnRowChange(row) {
-    if (rowsSelected.value.length > 1) return;
-    if (rowsSelected.value[0]?.id === row.id) return;
-    else if (rowsSelected.value.length === 1) await upsertPrice(rowsSelected.value[0]);
-    rowsSelected.value = [row];
-}
-
 function checkLastVisibleRow() {
     let lastVisibleRow = null;
 
@@ -255,39 +274,18 @@ function checkLastVisibleRow() {
 
 const addRow = (original = null) => {
     let copy = null;
-    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);
 
-        copy = {
+    copy = {
-            id: 0,
+        id: 0,
-            started: today,
+        started: today,
-            ended: nextWeek,
+        ended: nextWeek,
-            hasMinPrice: 0,
+        hasMinPrice: 0,
-            $index: 0,
+        $index: 0,
-        };
+    };
-    } else
-        copy = {
-            $index: original.$index - 1,
-            itemFk: original.itemFk,
-            name: original.name,
-            subName: original.subName,
-            value5: original.value5,
-            value6: original.value6,
-            value7: original.value7,
-            value8: original.value8,
-            value9: original.value9,
-            value10: original.value10,
-            warehouseFk: original.warehouseFk,
-            rate2: original.rate2,
-            rate3: original.rate3,
-            hasMinPrice: original.hasMinPrice,
-            minPrice: original.minPrice,
-            started: Date.vnNew(),
-            ended: Date.vnNew(),
-        };
     return { original, copy };
 };
 
@@ -300,7 +298,7 @@ function highlightNewRow({ $index: index }) {
         row.classList.add('highlight');
         setTimeout(() => {
             row.classList.remove('highlight');
-        }, 3000); // Duración de la animación en milisegundos
+        }, 3000);
     }
 }
 const openEditTableCellDialog = () => {
@@ -411,9 +409,13 @@ function handleOnDataSave({ CrudModelRef }) {
             url="FixedPrices/filter"
             :order="['itemFk DESC', 'name DESC']"
             save-url="FixedPrices/crud"
-            :user-params="{ warehouseFk: user.warehouseFk }"
             ref="tableRef"
             dense
+            :filter="{
+                where: {
+                    warehouseFk: user.warehouseFk,
+                },
+            }"
             :columns="columns"
             default-mode="table"
             auto-load
@@ -427,7 +429,6 @@ function handleOnDataSave({ CrudModelRef }) {
                 disableInfiniteScroll: true,
             }"
             v-model:selected="rowsSelected"
-            :row-click="saveOnRowChange"
             :create-as-dialog="false"
             :create="{
                 onDataSaved: handleOnDataSave,

test/cypress/integration/item/ItemFixedPrice.spec.js

@@ -0,0 +1,63 @@
+/// <reference types="cypress" />
+function goTo(n = 1) {
+    return `.q-virtual-scroll__content > :nth-child(${n})`;
+}
+const firstRow = goTo();
+`.q-virtual-scroll__content > :nth-child(2)`;
+describe('Handle Items FixedPrice', () => {
+    beforeEach(() => {
+        cy.viewport(1280, 720);
+        cy.login('developer');
+        cy.visit('/#/item/fixed-price', { timeout: 5000 });
+        cy.waitForElement('.q-table');
+        cy.get(
+            '.q-header > .q-toolbar > :nth-child(1) > .q-btn__content > .q-icon'
+        ).click();
+    });
+    it('filter', function () {
+        cy.get('.category-filter > :nth-child(1) > .q-btn__content > .q-icon').click();
+        cy.selectOption('.list > :nth-child(2)', 'Alstroemeria');
+        cy.get('.q-gutter-x-sm > .q-btn > .q-btn__content > .q-icon').click();
+
+        cy.get('.q-page-sticky > div > .q-btn > .q-btn__content > .q-icon').click();
+        cy.selectOption(`${firstRow} > :nth-child(2)`, '#13');
+        cy.get(`${firstRow} > :nth-child(4)`).find('input').type(1);
+        cy.get(`${firstRow} > :nth-child(5)`).find('input').type('2');
+        cy.selectOption(`${firstRow} > :nth-child(9)`, 'Warehouse One');
+        cy.get('.q-notification__message').should('have.text', 'Data saved');
+        /* ==== End Cypress Studio ==== */
+    });
+    it('Create and delete ', function () {
+        cy.get('.q-gutter-x-sm > .q-btn > .q-btn__content > .q-icon').click();
+        cy.get('.q-page-sticky > div > .q-btn > .q-btn__content > .q-icon').click();
+        cy.selectOption(`${firstRow} > :nth-child(2)`, '#11');
+        cy.get(`${firstRow} > :nth-child(4)`).type('1');
+        cy.get(`${firstRow} > :nth-child(5)`).type('2');
+        cy.selectOption(`${firstRow} > :nth-child(9)`, 'Warehouse One');
+        cy.get('.q-notification__message').should('have.text', 'Data saved');
+        cy.get('.q-gutter-x-sm > .q-btn > .q-btn__content > .q-icon').click();
+        cy.get(`${firstRow} > .text-right > .q-btn > .q-btn__content > .q-icon`).click();
+        cy.get(
+            '.q-card__actions > .q-btn--unelevated > .q-btn__content > .block'
+        ).click();
+        cy.get('.q-notification__message').should('have.text', 'Data saved');
+    });
+
+    it('Massive edit', function () {
+        cy.get(' .bg-header > :nth-child(1) > .q-checkbox > .q-checkbox__inner ').click();
+        cy.get('#subToolbar > .q-btn--standard').click();
+        cy.selectOption("[data-cy='field-to-edit']", 'Min price');
+        cy.dataCy('value-to-edit').find('input').type('1');
+        cy.get('.countLines').should('have.text', ' 1 ');
+        cy.get('.q-mt-lg > .q-btn--standard').click();
+        cy.get('.q-notification__message').should('have.text', 'Data saved');
+    });
+    it('Massive remove', function () {
+        cy.get(' .bg-header > :nth-child(1) > .q-checkbox > .q-checkbox__inner ').click();
+        cy.get('#subToolbar > .q-btn--flat').click();
+        cy.get(
+            '.q-card__actions > .q-btn--unelevated > .q-btn__content > .block'
+        ).click();
+        cy.get('.q-notification__message').should('have.text', 'Data saved');
+    });
+});