ref #6104 fix validations,css and tests

src/components/common/VnLog.vue

@@ -373,7 +373,7 @@ function filterFn(val, update, abortFn, type) {
         const needle = val.toLowerCase();
         if (type === 'actions')
             filteredActions.value = actions.value.filter((item) =>
-                t(`models.${item}`).toLowerCase().includes(needle)
+                validations[item].locale.name.includes(needle)
             );
         if (type === 'workers') {
             if (isNaN(needle))
@@ -507,7 +507,7 @@ setLogTree();
                                             flat
                                             round
                                             :title="t('pointRecord')"
-                                            padding="xs"
+                                            padding="none"
                                             v-if="log.action != 'insert'"
                                             @click.stop="
                                                 openPointRecord(log.id, modelLog)
@@ -571,8 +571,8 @@ setLogTree();
                                     size="sm"
                                     @click="log.expand = !log.expand"
                                 />
-                                <QList v-if="log.props.length" class="attributes">
+                                <span v-if="log.props.length" class="attributes">
-                                    <QItem v-if="!log.expand" class="q-pa-none text-grey">
+                                    <span v-if="!log.expand" class="q-pa-none text-grey">
                                         <span
                                             v-for="(prop, propIndex) in log.props"
                                             :key="propIndex"
@@ -582,12 +582,12 @@ setLogTree();
                                                 {{ prop.nameI18n }}:
                                             </span>
                                             <VnJsonValue :value="prop.val.val" />
-                                            <span v-if="propIndex < log.props.length - 1">
+                                            <span v-if="propIndex < log.props.length - 1"
-                                                ,
+                                                >,&nbsp;
                                             </span>
                                         </span>
-                                    </QItem>
+                                    </span>
-                                    <QItem
+                                    <span
                                         v-if="log.expand"
                                         class="expanded-json column q-pa-none"
                                     >
@@ -611,8 +611,8 @@ setLogTree();
                                                 </span>
                                             </span>
                                         </div>
-                                    </QItem>
+                                    </span>
-                                </QList>
+                                </span>
                                 <span v-if="!log.props.length" class="description">
                                     {{ log.description }}
                                 </span>
@@ -678,11 +678,11 @@ setLogTree();
                     >
                         <template #option="{ opt, index, itemProps }">
                             <QItem :index="index" v-bind="itemProps">
-                                {{ t(`models.${opt}`) }}
+                                {{ useFirstUpper(validations[opt].locale.name) }}
                             </QItem>
                         </template>
                         <template #selected-item="{ opt }">
-                            {{ t(`models.${opt}`) }}
+                            {{ useFirstUpper(validations[opt].locale.name) }}
                         </template>
                     </QSelect>
                 </QItem>
@@ -943,11 +943,21 @@ setLogTree();
             font-size: 0.9rem;
         }
         .q-btn {
+            visibility: hidden;
             float: right;
         }
     }
+
+    &:hover {
+        .model-info {
+            .q-btn {
+                visibility: visible;
+            }
+        }
+    }
 }
 .changes-log {
+    width: 100%;
     overflow: hidden;
 
     &:last-child {
@@ -983,11 +993,18 @@ setLogTree();
                 }
             }
         }
+        .q-btn.pit {
+            visibility: hidden;
+        }
+        &:hover .q-btn.pit {
+            visibility: visible;
+        }
     }
     & > .change-detail {
-        background-color: var(--vn-gray);
+        position: relative;
         overflow: hidden;
         text-overflow: ellipsis;
+        background-color: var(--vn-gray);
         white-space: nowrap;
         box-sizing: border-box;
         & > .q-icon {
@@ -1042,11 +1059,6 @@ en:
         Edits: Edits
         Deletes: Deletes
         Accesses: Accesses
-    models:
-        Claim: Reclamación
-        ClaimDms: Documento
-        ClaimBeginning: Comienzo
-        ClaimObservation: Observación
     Users:
         User: Usuario
         All: Todo

test/cypress/integration/vnLog.spec.js

@@ -1,31 +1,21 @@
 /// <reference types="cypress" />
-describe('ClaimNotes', () => {
+describe('VnLog', () => {
     beforeEach(() => {
         cy.login('developer');
         cy.visit(`/#/claim/${1}/log`);
-    });
+        cy.get('.q-gutter-x-sm > .q-btn > .q-btn__content > .q-icon').click();
-
-    it('should have just one record', () => {
-        cy.get('.model-info .q-btn').eq(1).click();
-        cy.get('.user-log .model-log').its('length').should('eq', 1);
-        cy.get('.q-page-sticky .q-btn').click();
-        cy.get('.user-log .model-log').its('length').should('eq', 4);
     });
 
     it('should filter by insert actions', () => {
-        cy.get('.q-gutter-x-sm > .q-btn > .q-btn__content > .q-icon').click();
         cy.get('.q-checkbox__inner').eq(0).click();
-        cy.get('.q-page > .q-drawer-container > .fullscreen').click();
+        cy.get('.q-page').click();
         cy.get('.model-info .q-chip__content').eq(0).should('have.text', 'Document');
         cy.get('.model-info .q-chip__content').eq(1).should('have.text', 'Beginning');
     });
 
-    it('should show the point record', () => {
+    it('should filter by entity', () => {
-        cy.get('.pit').eq(0).click();
+        cy.get('.q-scrollarea .q-list .q-item .q-select').eq(0).click();
-        cy.get('.q-menu .q-card .header').should('have.text', 'Observation #1');
+        cy.get('.q-scrollarea .q-list .q-item .q-select').eq(0).type('mien');
-        cy.get('.q-menu .q-card .json-string').should(
+        cy.get('[role="listbox"] .q-item').should('have.text', 'Comienzo');
-            'have.text',
-            'Waiting for customer'
-        );
     });
 });

test/vitest/__tests__/components/common/VnLog.spec.js

@@ -2,31 +2,30 @@ import { vi, describe, expect, it, beforeAll, afterEach } from 'vitest';
 import { createWrapper } from 'app/test/vitest/helper';
 import VnLog from 'src/components/common/VnLog.vue';
 
-const mockValidations = {
-    Claim: {
-        locale: {
-            name: 'reclamación',
-        },
-    },
-    ClaimObservation: {
-        locale: {
-            name: 'observación',
-        },
-    },
-    ClaimDms: {
-        locale: {
-            name: 'documento',
-        },
-    },
-    ClaimBeginning: {
-        locale: {
-            name: 'comienzo',
-        },
-    },
-};
-
 describe('VnLog', () => {
     let vm;
+    const mockValidations = {
+        Claim: {
+            locale: {
+                name: 'reclamación',
+            },
+        },
+        ClaimObservation: {
+            locale: {
+                name: 'observación',
+            },
+        },
+        ClaimDms: {
+            locale: {
+                name: 'documento',
+            },
+        },
+        ClaimBeginning: {
+            locale: {
+                name: 'comienzo',
+            },
+        },
+    };
 
     beforeAll(() => {
         vm = createWrapper(VnLog, {
@@ -38,6 +37,7 @@ describe('VnLog', () => {
                 model: 'Claim',
             },
         }).vm;
+        vm.validations = mockValidations;
     });
 
     afterEach(() => {
@@ -100,7 +100,6 @@ describe('VnLog', () => {
                 },
             },
         ];
-        vm.validations = mockValidations;
         vm.logTree = vm.getLogs(fakeLogTreeData);
         expect(vm.logTree[0].originFk).toEqual(1);
         expect(vm.logTree[0].logs[0].user.name).toEqual('salesPerson');
@@ -121,11 +120,11 @@ describe('VnLog', () => {
         expect(vm.selectedFilters.action).toEqual({ inq: ['insert', 'update'] });
     });
 
-    /*it('should correctly set the date from', () => {
+    it('should correctly set the date from', () => {
         vm.date = '18-09-2023';
         vm.selectFilter('date', 'from');
         expect(vm.selectedFilters.creationDate).toEqual({
             between: ['2023-09-18T00:00:00.000Z', '2023-09-18T19:59:59.999Z'],
         });
-    }); */
+    });
 });