wbuezas
/
salix-front-mindshore-fork2
forked from verdnatura/salix-front
0
0
Fork 0
Code Pull Requests Activity

Merge pull request 'fix: #8061 Handle new CP' (!948) from 8061_newCP into dev 

Reviewed-on: verdnatura/salix-front#948
Reviewed-by: Alex Moreno <alexm@verdnatura.es>
This commit is contained in:
Javier Segarra 2024-11-25 12:17:13 +00:00
parent 655a76ff62 ee2450c82f
commit ec96f6bea7
6 changed files with 129 additions and 53 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
src/components/CreateNewCityForm.vue
View File

@ -17,10 +17,6 @@ const $props = defineProps({
type: Number,
default: null,
},
provinces: {
type: Array,
default: () => [],
},
});
const { t } = useI18n();
@ -56,7 +52,6 @@ const onDataSaved = (...args) => {
:province-selected="$props.provinceSelected"
:country-fk="$props.countryFk"
v-model="data.provinceFk"
:provinces="$props.provinces"
/>
</VnRow>
</template>

55
src/components/CreateNewPostcodeForm.vue
View File

@ -56,10 +56,10 @@ async function onCityCreated(newTown, formData) {
}
function setTown(newTown, data) {
if (!newTown) return;
town.value = newTown;
data.provinceFk = newTown.provinceFk;
data.countryFk = newTown.province.countryFk;
if (!newTown) return;
town.value = newTown;
}
async function setProvince(id, data) {
@ -73,7 +73,7 @@ async function onProvinceCreated(data) {
await provincesFetchDataRef.value.fetch({
where: { countryFk: postcodeFormData.countryFk },
});
postcodeFormData.provinceFk.value = data.id;
postcodeFormData.provinceFk = data.id;
}
watch(
@ -90,22 +90,33 @@ watch(
postcodeFormData.townFk = null;
}
if (oldValueFk !== newCountryFk) {
await provincesFetchDataRef.value.fetch({
where: {
countryFk: newCountryFk,
},
});
await townsFetchDataRef.value.fetch({
where: {
provinceFk: {
inq: provincesOptions.value.map(({ id }) => id),
},
},
});
await fetchProvinces(newCountryFk);
await fetchTowns(newCountryFk);
}
}
);
async function fetchTowns(countryFk) {
const townsFilter = countryFk
? {
where: {
provinceFk: {
inq: provincesOptions.value.map(({ id }) => id),
},
},
}
: {};
await townsFetchDataRef.value.fetch(townsFilter);
}
async function fetchProvinces(countryFk) {
const provincesFilter = countryFk
? {
where: {
countryFk: countryFk,
},
}
: {};
await provincesFetchDataRef.value.fetch(provincesFilter);
}
watch(
() => postcodeFormData.provinceFk,
async (newProvinceFk, oldValueFk) => {
@ -147,6 +158,13 @@ async function handleCountries(data) {
auto-load
url="Towns/location"
/>
<FetchData
ref="CountriesFetchDataRef"
:sort-by="['name ASC']"
@on-fetch="handleCountries"
auto-load
url="Countries"
/>
<FormModelPopup
url-create="postcodes"
@ -193,7 +211,6 @@ async function handleCountries(data) {
<CreateNewCityForm
:country-fk="data.countryFk"
:province-selected="data.provinceFk"
:provinces="provincesOptions"
@on-data-saved="
(_, requestResponse) =>
onCityCreated(requestResponse, data)
@ -209,14 +226,12 @@ async function handleCountries(data) {
@update:model-value="(value) => setProvince(value, data)"
v-model="data.provinceFk"
:clearable="true"
:provinces="provincesOptions"
@on-province-created="onProvinceCreated"
/>
<VnSelect
url="Countries"
:sort-by="['name ASC']"
:label="t('Country')"
@update:options="handleCountries"
:options="countriesOptions"
hide-selected
option-label="name"
option-value="id"

12
src/components/CreateNewProvinceForm.vue
View File

@ -1,5 +1,5 @@
<script setup>
import { reactive, ref } from 'vue';
import { computed, reactive, ref } from 'vue';
import { useI18n } from 'vue-i18n';
import FetchData from 'components/FetchData.vue';
@ -34,6 +34,12 @@ const onDataSaved = (dataSaved, requestResponse) => {
);
emit('onDataSaved', dataSaved, requestResponse);
};
const where = computed(() => {
if (!$props.countryFk) {
return {};
}
return { countryFk: $props.countryFk };
});
</script>
<template>
@ -41,9 +47,7 @@ const onDataSaved = (dataSaved, requestResponse) => {
@on-fetch="(data) => (autonomiesOptions = data)"
auto-load
:filter="{
where: {
countryFk: $props.countryFk,
},
where,
}"
url="Autonomies/location"
:sort-by="['name ASC']"

39
src/components/VnSelectProvince.vue
View File

@ -1,5 +1,5 @@
<script setup>
import { ref } from 'vue';
import { ref, watch } from 'vue';
import { useValidator } from 'src/composables/useValidator';
import { useI18n } from 'vue-i18n';
@ -17,20 +17,23 @@ const $props = defineProps({
type: Number,
default: null,
},
provinces: {
type: Array,
default: () => [],
},
});
const provinceFk = defineModel({ type: Number, default: null });
const { validate } = useValidator();
const { t } = useI18n();
const filter = ref({
include: { relation: 'country' },
where: {
countryFk: $props.countryFk,
},
});
const provincesOptions = ref($props.provinces);
provinceFk.value = $props.provinceSelected;
const provincesFetchDataRef = ref();
provinceFk.value = $props.provinceSelected;
if (!$props.countryFk) {
filter.value.where = {};
}
async function onProvinceCreated(_, data) {
await provincesFetchDataRef.value.fetch({ where: { countryFk: $props.countryFk } });
provinceFk.value = data.id;
@ -39,23 +42,29 @@ async function onProvinceCreated(_, data) {
async function handleProvinces(data) {
provincesOptions.value = data;
}
watch(
() => $props.countryFk,
async () => {
if ($props.countryFk) {
filter.value.where.countryFk = $props.countryFk;
} else filter.value.where = {};
await provincesFetchDataRef.value.fetch({});
}
);
</script>
<template>
<FetchData
ref="provincesFetchDataRef"
:filter="{
include: { relation: 'country' },
where: {
countryFk: $props.countryFk,
},
}"
:filter="filter"
@on-fetch="handleProvinces"
url="Provinces"
auto-load
/>
<VnSelectDialog
:label="t('Province')"
:options="$props.provinces"
:options="provincesOptions"
:tooltip="t('Create province')"
hide-selected
v-model="provinceFk"

66
test/cypress/integration/vnComponent/vnLocation.spec.js
View File

@ -99,7 +99,7 @@ describe('VnLocation', () => {
});
it('Create postCode', () => {
const postCode = '1234475';
const postCode = Math.floor(100000 + Math.random() * 900000);
const province = 'Valencia';
cy.get(createLocationButton).click();
cy.get('.q-card > h1').should('have.text', 'New postcode');
@ -115,20 +115,68 @@ describe('VnLocation', () => {
checkVnLocation(postCode, province);
});
it('Create city', () => {
const postCode = '9011';
const province = 'Saskatchew';
it('Create city without country', () => {
const cityName = 'Saskatchew'.concat(Math.random(1 * 100));
cy.get(createLocationButton).click();
cy.get(dialogInputs).eq(0).type(postCode);
cy.get(
`${createForm.prefix} > :nth-child(4) > .q-select > ${createForm.sufix} > :nth-child(2) > .q-icon`
).click();
cy.selectOption('#q-portal--dialog--3 .q-select', 'one');
cy.get('#q-portal--dialog--3 .q-input').type(province);
cy.get('#q-portal--dialog--3 .q-input').type(cityName);
cy.get('#q-portal--dialog--3 .q-btn--standard').click();
cy.get('#q-portal--dialog--1 .q-btn--standard').click();
cy.waitForElement('.q-form');
checkVnLocation(postCode, province);
});
it('Create province without country', () => {
const provinceName = 'Saskatchew'.concat(Math.random(1 * 100));
cy.get(createLocationButton).click();
cy.get(
`${createForm.prefix} > :nth-child(5) > .q-select > ${createForm.sufix} > :nth-child(2) `
)
.eq(0)
.click();
cy.selectOption('#q-portal--dialog--3 .q-select', 'one');
cy.countSelectOptions('#q-portal--dialog--3 .q-select', 4);
cy.get('#q-portal--dialog--3 .q-input').type(provinceName);
cy.get('#q-portal--dialog--3 .q-btn--standard').click();
});
it('Create city with country', () => {
const cityName = 'Saskatchew'.concat(Math.random(1 * 100));
cy.get(createLocationButton).click();
cy.selectOption(
`${createForm.prefix} > :nth-child(5) > :nth-child(3) `,
'Italia'
);
cy.get(
`${createForm.prefix} > :nth-child(4) > .q-select > ${createForm.sufix} > :nth-child(2) > .q-icon`
).click();
cy.selectOption('#q-portal--dialog--4 .q-select', 'Province four');
cy.countSelectOptions('#q-portal--dialog--4 .q-select', 1);
cy.get('#q-portal--dialog--4 .q-input').type(cityName);
cy.get('#q-portal--dialog--4 .q-btn--standard').click();
});
it('Create province with country', () => {
const provinceName = 'Saskatchew'.concat(Math.random(1 * 100));
cy.get(createLocationButton).click();
cy.selectOption(
`${createForm.prefix} > :nth-child(5) > :nth-child(3) `,
'España'
);
cy.get(
`${createForm.prefix} > :nth-child(5) > .q-select > ${createForm.sufix} > :nth-child(2) `
)
.eq(0)
.click();
cy.selectOption('#q-portal--dialog--4 .q-select', 'one');
cy.countSelectOptions('#q-portal--dialog--4 .q-select', 2);
cy.get('#q-portal--dialog--4 .q-input').type(provinceName);
cy.get('#q-portal--dialog--4 .q-btn--standard').click();
});
function checkVnLocation(postCode, province) {

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

@ -91,6 +91,11 @@ Cypress.Commands.add('selectOption', (selector, option) => {
cy.get(selector).click();
cy.get('.q-menu .q-item').contains(option).click();
});
Cypress.Commands.add('countSelectOptions', (selector, option) => {
cy.waitForElement(selector);
cy.get(selector).click();
cy.get('.q-menu .q-item').should('have.length', option);
});
Cypress.Commands.add('fillInForm', (obj, form = '.q-form > .q-card') => {
cy.waitForElement('.q-form > .q-card');