verdnatura/salix-front
verdnatura
/
salix-front
2
3
Fork 1
Code Issues Pull Requests 77 Releases Wiki Activity

ref #6104 recreate vnlog #96

Merged
jorgep merged 24 commits from 6104-changeVnLog into dev 2023-12-11 11:34:36 +00:00
Conversation 0 Commits 24 Files Changed 19 +112 -117
6 changed files with 112 additions and 117 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit 868ecdf680 - Show all commits

56
src/components/common/VnLog.vue
View File

@ -3,11 +3,11 @@ import { ref } from 'vue';
import { useI18n } from 'vue-i18n';
import { useRoute } from 'vue-router';
import axios from 'axios';
import { date } from 'quasar';
import { useStateStore } from 'stores/useStateStore';
import { toRelativeDate, toDateString, toDateHour } from 'src/filters';
import { toRelativeDate } from 'src/filters';
import { useColor } from 'src/composables/useColor';
import { useFirstUpper } from 'src/composables/useFirstUpper';
import { useIso8601 } from 'src/composables/useIso8601';
import { useValidator } from 'src/composables/useValidator';
import VnAvatar from '../ui/VnAvatar.vue';
import VnJsonValue from '../common/VnJsonValue.vue';
@ -63,8 +63,8 @@ const changeInput = ref();
const searchInput = ref();
const userRadio = ref();
const userSelect = ref();
const date = ref();
const dateDialog = ref(false);
const dateFrom = ref();
const dateFromDialog = ref(false);
const dateTo = ref();
const dateToDialog = ref(false);
const selectedFilters = ref({});
@ -164,7 +164,8 @@ function getLogs(data) {
let modelLog = null;
let prevLog;
let nLogs;
console.log('EEEEEEE', data);
console.log('validations', validations);
data.forEach((log) => {
const locale = validations[log.changedModel]?.locale || {};
@ -267,18 +268,25 @@ async function applyFilter() {
}
function setDate(type) {
const from = date.value
? useIso8601(date.value.split('-').reverse().join('-'))
let from = dateFrom.value
? date.formatDate(dateFrom.value.split('-').reverse().join('-'), 'YYYY-MM-DD')
: undefined;
jorgep marked this conversation as resolved Outdated
alexm commented 2023-10-03 07:41:08 +00:00
Outdated
Review
Copy Link

https://quasar.dev/quasar-utils/date-utils

https://quasar.dev/quasar-utils/date-utils
jorgep commented 2023-10-04 07:54:43 +00:00
Outdated
Review
Copy Link

En el menú de filtros se muestra la fecha en formato español, por lo que si hago un casteo directo confunde el día con el mes y al revés. Tengo que hacerlo así:

const from = dateFrom.value
    ? date.formatDate(
          dateFrom.value.split('-').reverse().join('-'),
          'YYYY-MM-DDTHH:mm:ss.SSSZ'
      )
    : undefined;
En el menú de filtros se muestra la fecha en formato español, por lo que si hago un casteo directo confunde el día con el mes y al revés. Tengo que hacerlo así: const from = dateFrom.value ? date.formatDate( dateFrom.value.split('-').reverse().join('-'), 'YYYY-MM-DDTHH:mm:ss.SSSZ' ) : undefined;
const to = dateTo.value
? useIso8601(`${dateTo.value.split('-').reverse().join('-')} 21:59:59.999`)
: useIso8601(`${date.value.split('-').reverse().join('-')} 21:59:59.999`);
from = date.adjustDate(from, { hour: 0, minute: 0, second: 0, millisecond: 0 }, true);
let to = dateTo.value
? date.formatDate(dateTo.value.split('-').reverse().join('-'), 'YYYY-MM-DD')
: date.formatDate(dateFrom.value.split('-').reverse().join('-'), 'YYYY-MM-DD');
to = date.adjustDate(
to,
{ hour: 21, minute: 59, second: 59, millisecond: 999 },
true
);
switch (type) {
case 'from':
return { between: [from, to] };
case 'to': {
if (date.value) {
if (dateFrom.value) {
return {
between: [from, to],
};
@ -325,7 +333,7 @@ function selectFilter(type, dateType) {
userSelect.value !== null ? userSelect.value : undefined;
}
if (type === 'date') {
if (!date.value && !dateTo.value) {
if (!dateFrom.value && !dateTo.value) {
selectedFilters.value.creationDate = undefined;
} else if (dateType === 'to') {
selectedFilters.value.creationDate = setDate('to');
@ -352,7 +360,7 @@ async function clearFilter() {
userSelect.value = undefined;
searchInput.value = undefined;
changeInput.value = undefined;
date.value = undefined;
dateFrom.value = undefined;
dateTo.value = undefined;
Object.keys(checkboxOptions.value).forEach(
(opt) => (checkboxOptions.value[opt].selected = false)
@ -493,8 +501,10 @@ setLogTree();
<div
class="date text-grey text-caption q-mr-sm"
:title="
toDateHour(log.creationDate) ??
`date:'dd/MM/yyyy HH:mm:ss'`
date.formatDate(
log.creationDate,
'DD/MM/YYYY hh:mm:ss'
) ?? `date:'dd/MM/yyyy HH:mm:ss'`
"
>
{{ toRelativeDate(log.creationDate) }}
@ -775,10 +785,10 @@ setLogTree();
<QInput
class="full-width"
:label="t('globals.date')"
@click="dateDialog = true"
@click="dateFromDialog = true"
@focus="(evt) => evt.target.blur()"
@clear="selectFilter('date', 'to')"
v-model="date"
v-model="dateFrom"
clearable
clear-icon="close"
/>
@ -798,18 +808,17 @@ setLogTree();
</QList>
</QScrollArea>
</QDrawer>
<QDialog v-model="dateDialog">
<QDialog v-model="dateFromDialog">
<QDate
:years-in-month-view="false"
v-model="date"
v-model="dateFrom"
dense
flat
minimal
@update:model-value="
(value) => {
dateDialog = false;
const formatDate = toDateString(new Date(value));
date = formatDate.split('-').reverse().join('-');
dateFromDialog = false;
dateFrom = date.formatDate(value, 'DD-MM-YYYY');
selectFilter('date', 'from');
}
"
@ -824,8 +833,7 @@ setLogTree();
@update:model-value="
(value) => {
dateToDialog = false;
const formatDate = toDateString(new Date(value));
dateTo = formatDate.split('-').reverse().join('-');
dateTo = date.formatDate(value, 'DD-MM-YYYY');
selectFilter('date', 'to');
}
"

18
src/composables/useIso8601.js
View File

@ -1,18 +0,0 @@
export function useIso8601(dateString) {
// Crear un objeto Date a partir de la cadena de texto
const date = new Date(dateString);
// Obtener los componentes de fecha y hora
const year = date.getUTCFullYear();
const month = String(date.getUTCMonth() + 1).padStart(2, '0');
const day = String(date.getUTCDate()).padStart(2, '0');
const hours = String(date.getUTCHours()).padStart(2, '0');
const minutes = String(date.getUTCMinutes()).padStart(2, '0');
const seconds = String(date.getUTCSeconds()).padStart(2, '0');
const milliseconds = String(date.getUTCMilliseconds()).padStart(3, '0');
// Formatear la cadena en el formato ISO 8601
const formattedDate = `${year}-${month}-${day}T${hours}:${minutes}:${seconds}.${milliseconds}Z`;
return formattedDate;
}

16
test/cypress/integration/workerList.spec.js
View File

@ -1,4 +1,6 @@
describe('WorkerList', () => {
const workerFieldNames =
'.card-list-body > .list-items > :nth-child(2) > .value > span';
beforeEach(() => {
cy.viewport(1280, 720);
cy.login('developer');
@ -6,19 +8,13 @@ describe('WorkerList', () => {
});
jorgep marked this conversation as resolved
alexm commented 2023-10-03 07:48:34 +00:00
Review
Copy Link

Mira si pots simplificar els e2e gastant comandos de cypress test/cypress/support/commands.js
Exemple: test/cypress/integration/claimDevelopment.spec.js

Mira si pots simplificar els e2e gastant comandos de cypress test/cypress/support/commands.js Exemple: test/cypress/integration/claimDevelopment.spec.js
it('should load workers', () => {
cy.get('.card-list-body > .list-items > :nth-child(2) > .value > span')
.eq(0)
.should('have.text', 'JessicaJones');
cy.get('.card-list-body > .list-items > :nth-child(2) > .value > span')
.eq(1)
.should('have.text', 'BruceBanner');
cy.get('.card-list-body > .list-items > :nth-child(2) > .value > span')
.eq(2)
.should('have.text', 'CharlesXavier');
cy.get(workerFieldNames).eq(0).should('have.text', 'JessicaJones');
cy.get(workerFieldNames).eq(1).should('have.text', 'BruceBanner');
cy.get(workerFieldNames).eq(2).should('have.text', 'CharlesXavier');
});
it('should open the worker summary', () => {
cy.get('.card-list-body .actions .q-btn:nth-child(2)').eq(0).click();
cy.openListSummary(0);
cy.get('.summaryHeader div').should('have.text', '1110 - Jessica Jones');
cy.get('.summary .header').eq(0).invoke('text').should('include', 'Basic data');
cy.get('.summary .header').eq(1).should('have.text', 'User data');

4
test/cypress/support/commands.js
View File

@ -127,4 +127,8 @@ Cypress.Commands.add('validateRow', (rowSelector, expectedValues) => {
}
});
});
Cypress.Commands.add('openListSummary', (row) => {
cy.get('.card-list-body .actions .q-btn:nth-child(2)').eq(row).click();
});
// registerCommands();

130
test/vitest/__tests__/components/common/VnLog.spec.js
View File

@ -1,9 +1,64 @@
import { vi, describe, expect, it, beforeAll, afterEach } from 'vitest';
import { createWrapper } from 'app/test/vitest/helper';
import { createWrapper, axios } from 'app/test/vitest/helper';
import VnLog from 'src/components/common/VnLog.vue';
describe('VnLog', () => {
let vm;
const fakeLogTreeData = [
{
id: 2,
originFk: 1,
userFk: 18,
action: 'update',
changedModel: 'ClaimObservation',
oldInstance: {},
newInstance: {
claimFk: 1,
text: 'Waiting for customer',
},
creationDate: '2023-09-18T12:25:34.000Z',
changedModelId: '1',
changedModelValue: null,
description: null,
user: {
id: 18,
name: 'salesPerson',
nickname: 'salesPersonNick',
image: '4fa3ada0-3ac4-11eb-9ab8-27f6fc3b85fd',
worker: {
id: 18,
userFk: 18,
},
},
},
{
id: 1,
originFk: 1,
userFk: 18,
action: 'update',
changedModel: 'Claim',
oldInstance: {
hasToPickUp: false,
},
newInstance: {
hasToPickUp: true,
},
creationDate: '2023-09-18T12:25:34.000Z',
changedModelId: '1',
changedModelValue: null,
description: null,
user: {
id: 18,
name: 'salesPerson',
nickname: 'salesPersonNick',
image: '4fa3ada0-3ac4-11eb-9ab8-27f6fc3b85fd',
worker: {
id: 18,
userFk: 18,
},
},
},
];
const mockValidations = {
Claim: {
locale: {
@ -27,7 +82,11 @@ describe('VnLog', () => {
},
};
beforeAll(() => {
beforeAll(async () => {
axios.get.mockImplementation(() => {
return { data: fakeLogTreeData };
});
vm = createWrapper(VnLog, {
global: {
stubs: [],
@ -45,68 +104,12 @@ describe('VnLog', () => {
});
it('should correctly set logTree', async () => {
const fakeLogTreeData = [
{
id: 2,
originFk: 1,
userFk: 18,
action: 'update',
changedModel: 'ClaimObservation',
oldInstance: {},
newInstance: {
claimFk: 1,
text: 'Waiting for customer',
},
creationDate: '2023-09-18T12:25:34.000Z',
changedModelId: '1',
changedModelValue: null,
description: null,
user: {
id: 18,
name: 'salesPerson',
nickname: 'salesPersonNick',
image: '4fa3ada0-3ac4-11eb-9ab8-27f6fc3b85fd',
worker: {
id: 18,
userFk: 18,
},
},
},
{
id: 1,
originFk: 1,
userFk: 18,
action: 'update',
changedModel: 'Claim',
oldInstance: {
hasToPickUp: false,
},
newInstance: {
hasToPickUp: true,
},
creationDate: '2023-09-18T12:25:34.000Z',
changedModelId: '1',
changedModelValue: null,
description: null,
user: {
id: 18,
name: 'salesPerson',
nickname: 'salesPersonNick',
image: '4fa3ada0-3ac4-11eb-9ab8-27f6fc3b85fd',
worker: {
id: 18,
userFk: 18,
},
},
},
];
vm.logTree = vm.getLogs(fakeLogTreeData);
expect(vm.logTree[0].originFk).toEqual(1);
expect(vm.logTree[0].logs[0].user.name).toEqual('salesPerson');
});
it('should correctly set the selectedFilters when filtering', async () => {
await vm.$nextTick();
it('should correctly set the selectedFilters when filtering', () => {
vm.searchInput = '1';
vm.userSelect = '21';
vm.checkboxOptions.insert.selected = true;
@ -121,10 +124,11 @@ describe('VnLog', () => {
});
it('should correctly set the date from', () => {
vm.date = '18-09-2023';
vm.dateFrom = '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'],
});
expect(vm.selectedFilters.creationDate.between).toEqual([
new Date('2023-09-18T00:00:00.000Z'),
new Date('2023-09-18T21:59:59.999Z'),
]);
});
});

5
test/vitest/helper.js
View File

@ -13,7 +13,6 @@ installQuasarPlugin({
Dialog,
},
});
axios.defaults.baseURL = 'http://localhost:9000/api/';
const pinia = createTestingPinia({ createSpy: vi.fn, stubActions: false });
jorgep marked this conversation as resolved Outdated
alexm commented 2023-10-03 07:50:07 +00:00
Outdated
Review
Copy Link

No crec que en test de front el front dega fer peticions al back.
Deuries poder tirar els test de front sense tindre arrancat res

No crec que en test de front el front dega fer peticions al back. Deuries poder tirar els test de front sense tindre arrancat res
const mockPush = vi.fn();
@ -35,8 +34,10 @@ vi.mock('vue-router', () => ({
}),
}));
vi.mock('axios');
vi.spyOn(useValidator, 'useValidator').mockImplementation(() => {
return { validate: vi.fn(), fetch: vi.fn() };
return { validate: vi.fn() };
});
class FormDataMock {