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

#7679 Improve NewPostCodeForm #787

Merged
jsegarra merged 10 commits from 7679_improve_newPostcode_form into dev 2024-10-21 11:17:48 +00:00
Conversation 0 Commits 10 Files Changed 2 +27 -6
2 changed files with 27 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

31
src/components/CreateNewPostcodeForm.vue
View File

@ -79,14 +79,20 @@ async function onProvinceCreated(data) {
watch( watch(
() => [postcodeFormData.countryFk], () => [postcodeFormData.countryFk],
async (newCountryFk, oldValueFk) => { async (newCountryFk, oldValueFk) => {
if (!!oldValueFk[0] && newCountryFk[0] !== oldValueFk[0]) { if (Array.isArray(newCountryFk)) {
newCountryFk = newCountryFk[0];
}
if (Array.isArray(oldValueFk)) {
oldValueFk = oldValueFk[0];
}
if (!!oldValueFk && newCountryFk !== oldValueFk) {
postcodeFormData.provinceFk = null; postcodeFormData.provinceFk = null;
postcodeFormData.townFk = null; postcodeFormData.townFk = null;
} }
if ((newCountryFk, newCountryFk !== postcodeFormData.countryFk)) { if (oldValueFk !== newCountryFk) {
await provincesFetchDataRef.value.fetch({ await provincesFetchDataRef.value.fetch({
where: { where: {
countryFk: newCountryFk[0], countryFk: newCountryFk,
}, },
}); });
await townsFetchDataRef.value.fetch({ await townsFetchDataRef.value.fetch({
@ -103,9 +109,12 @@ watch(
watch( watch(
() => postcodeFormData.provinceFk, () => postcodeFormData.provinceFk,
async (newProvinceFk) => { async (newProvinceFk) => {
if (newProvinceFk[0] && newProvinceFk[0] !== postcodeFormData.provinceFk) { if (Array.isArray(newProvinceFk)) {
newProvinceFk = newProvinceFk[0];
}
if (newProvinceFk !== postcodeFormData.provinceFk) {
await townsFetchDataRef.value.fetch({ await townsFetchDataRef.value.fetch({
where: { provinceFk: newProvinceFk[0] }, where: { provinceFk: newProvinceFk },
}); });
} }
} }
@ -125,16 +134,26 @@ async function handleCountries(data) {
<FetchData <FetchData
ref="provincesFetchDataRef" ref="provincesFetchDataRef"
@on-fetch="handleProvinces" @on-fetch="handleProvinces"
:sort-by="['name ASC']"
:limit="30"
alexm commented 2024-10-14 05:49:09 +00:00
Review
Copy Link

Esto va a hacer que solo cargue 30 provincias, fetchdata no pagina

Esto va a hacer que solo cargue 30 provincias, fetchdata no pagina
👀 1
jsegarra commented 2024-10-14 07:32:24 +00:00
Review
Copy Link

Correcto, el motivo del limit es que hay mas de 1000 poblaciones y provincias, por tanto no carga correctamente los desplegables.
Otro motivo, es que los usuarios no suelen buscan entre los elementos de la lista ya que escriben las primeras letras de su criterio de búsqueda

Correcto, el motivo del limit es que hay mas de 1000 poblaciones y provincias, por tanto no carga correctamente los desplegables. Otro motivo, es que los usuarios no suelen buscan entre los elementos de la lista ya que escriben las primeras letras de su criterio de búsqueda
auto-load auto-load
url="Provinces/location" url="Provinces/location"
/> />
<FetchData <FetchData
ref="townsFetchDataRef" ref="townsFetchDataRef"
:sort-by="['name ASC']"
:limit="30"
@on-fetch="handleTowns" @on-fetch="handleTowns"
auto-load auto-load
url="Towns/location" url="Towns/location"
/> />
<FetchData @on-fetch="handleCountries" auto-load url="Countries" /> <FetchData
@on-fetch="handleCountries"
:sort-by="['name ASC']"
:limit="30"
auto-load
url="Countries"
/>
<FormModelPopup <FormModelPopup
url-create="postcodes" url-create="postcodes"
model="postcode" model="postcode"

2
src/components/CreateNewProvinceForm.vue
View File

@ -46,6 +46,8 @@ const onDataSaved = (dataSaved, requestResponse) => {
}, },
}" }"
url="Autonomies/location" url="Autonomies/location"
:sort-by="['name ASC']"
:limit="30"
/> />
<FormModelPopup <FormModelPopup
:title="t('New province')" :title="t('New province')"